WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Simple Catch theme - linking custom header logo? (8 posts)

  1. silico26
    Member
    Posted 1 year ago #

    hi, here is the custom css for my header logo. it makes the logo appear much larger than the template default, which i am happy with (i intended it this way).

    h1#site-title a {
    color: transparent;
    }
    h1#site-title {
    background: url("http://devynconstruction.com/logo.png") no-repeat scroll 0

    is there anyway to link this image back to my home page? if so, how would it be done? my site is here.

    thanks in advance

  2. Brad Davis
    Member
    Posted 1 year ago #

    Hi, your image that you are using as a place holder that your link wraps around is just way to small. If you change the css to the following, it will increase the size of your place holder image to about the same size as your logo and make it appear like it is the link.

    h1#site-title a img {
    float: left;
    height: 204px;
    padding-right: 0px;
    width: 550px;
    }

  3. silico26
    Member
    Posted 1 year ago #

    thanks for your reply. i inserted this code into my custom css and it made the top half of the image appear linked perfectly... the bottom half however, is not a link. i tried adjusting the height from 204 to 500, but still stayed the same. strange!

  4. Andrew
    Forum Moderator
    Posted 1 year ago #

    Try displaying the image as a block element (though CSS).

  5. silico26
    Member
    Posted 1 year ago #

    @ andrew - i added

    display: inline-block

    to my custom css, so it looks like this

    h1#site-title a img {
    display: inline-block
    float: left;
    height: 504px;
    padding-right: 0px;
    width: 550px;
    }

    didn't seem to fix the issue. did i do it correctly?

  6. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    There is a max-height on that element here in the parent style.css file:

    h1#site-title a img {
        float: left;
        max-height: 90px;
        padding-right: 20px;
    }
  7. silico26
    Member
    Posted 1 year ago #

    @ yogi, good eye, now works perfectly. thank you! final code in my custom css:

    h1#site-title a img {
    float: left;
    height: 504px;
    max-height: 185px;
    padding-right: 0px;
    width: 550px;
    }
  8. Brad Davis
    Member
    Posted 1 year ago #

    sorry, forgot about the max-height element.... my bad!!

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.