Need elegant way to hide header text

  • mhgaither

    (@mhgaither)


    13 years ago

    My website is at https://www.michaelgaither.com/home. I have a new banner that has my site name in it, so I need to hide the header text (but still have it in the code so it appears at the top of the browser, etc.)

    I’ve tried adding both of these to my style sheet…

    text-indent: -999% !important
    text-indent: -999px !important

    …but in both cases, it knocks out my nav bar/menu. The visual effect is that it adds a bunch of line breaks.

    Is there a graceful way to hide the header text? I’ve looked on other forum sites, but I haven’t had any luck with any of the suggestions. Thanks.

Viewing 3 replies - 1 through 3 (of 3 total)
  • esmi

    (@esmi)

    .header h1,
.header h2 {
position:absolute;
top:-9999px;
left:-9999px;
}
    Michael

    (@alchymyth)

    I’ve tried adding both of these to my style sheet…

    to which styles?

    try:

    .header h1, .header h2 { text-indent: -9999px;}

    Thread Starter mhgaither

    (@mhgaither)

    I added them here. Note: I tried both with and w/o the text-align command left in:

    /* header */
    .header {
    background: #ffffff;
    text-align: center;
    text-indent: -999% !important;
    }

    .header img {
    float: left;
    padding-right: 1em;
    }

    .header h1 {
    color:#000000;
    padding-top: 3em;
    }

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Need elegant way to hide header text’ is closed to new replies.