Viewing 7 replies - 1 through 7 (of 7 total)
  • Thread Starter Tek

    (@tek)

    UGH… sorry I didn’t mean to do this… this was supposed to be a search… =( but now that I made a topic, let me tell you what I am looking for and maybe you can help?
    I am looking for how to in the CSS use an image for my header and NO TEXT . They will need to click on the image for it to bring you back *home*. I’m sure there is a way to supress it and I am just not thinking of it.
    Thanks! =)

    Read this:
    Header CSS Code

    Also take this out of your index.php;
    <?php bloginfo('name'); ?>
    It’s at the top, just under the body tag

    Thread Starter Tek

    (@tek)

    Damn… but if I take that out then the skins that USE the text will be screwed. =( Hmmm… Seems I just put myself in a hole here.

    Thread Starter Tek

    (@tek)

    LMAO… thanks for all your help… I think I just figured out a way to *cheat* that looks fine in both IE and FF. I’m laughing because it looks okay in both but its funny what the two browers are doing with the font.

    Tek: Don’t know if you still need to work it out. I hacked it by indenting the text to some insance amount (20,000 or something), then setting the overflow to hidden. Then by setting the width and height of the h1 div and assigning it a backround image, it should be clickable. I think. If you want I can have another look at it for you and post the code. Just let me know =). I’m a bit of a CSS newbie, so I’m sure there’s a better way though!
    https://www.geoffreytang.com/

    Whoops sorry. Little mistake just looked at my code: here’s what I did:
    #header
    {
    padding: 0px;
    margin: 0px;
    width: 850px;
    height: 150px;
    background: url(images/Your Image Here!);
    }
    h1 a
    {
    width: 850px;
    height: 150px;
    float: left;
    text-indent: -10000px;
    overflow: hidden;
    border:none;
    text-decoration: none
    }
    h1 a:hover
    {
    text-decoration: none (stops it from being underlined which causes some flickering)
    }
    This should overlay the h1 div on top of the header div. Assigning a background to the header div will make it a ‘clickable’ link (in reality, the h1 div is being clicked). Hope this makes sense. It’s messy, but works in Moz and IE and Opera I believe without any problems.
    https://www.geoffreytang.com/

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘image header’ is closed to new replies.