[Solved] Hiding h1 in IE Using display:none or text-indent

[Ranger]

Hey everyone,
I think this should be a fairly simple issue, but I can’t seem to find a suitable answer around the ‘nets.
so,
I’m trying to hide the header that reads "The Ryan Gregson Web-log" that shows up in orange in IE (not the image with the same caption above)
I can get it to disappear in firefox using the display: none, and the text-indent: -9999px, but neither work in IE. What to do?
this is done in wordpress, btw, playing with the whiteboard theme.

here’s the site:

http://www.ryangregson.com/blog
the site is kinda lame, I know, i’m just learning.

here’s some code where the problem should be:
this is code from the header.php. the wrapper and container divs are closed in the footer.php.

Code:

/”>

and here’s the CSS

Code:

#maincol { width: 460px; float: left;padding-left: 50px;padding-top: 50px;}
body {margin: 0px auto;background: black;}
#topthing{width: 1400px; height: 338px; background: url(/blog/wp-content/themes/whiteboard/images/myheader.jpg) black; margin: 0px auto;}
#topthing a{
margin: 0 auto;
padding-top: 100px;
display: block;
width: 700px;
height: 200px;
}
h1#logo{display: none; /*text-indent: -9999px;*/}

#container{width: 1400px;background: url(/blog/wp-content/themes/whiteboard/images/middle.jpg) repeat-y;margin: 0px auto;}
#wrapper{width: 700px; margin: 0px auto;}

any help would be appreciated, thanks!

also I just ran the Validator, and it came up with this response which could be relevant, but honestly, this is not direct enough for me to be helpful:

Line 79, Column 3: unclosed start-tag requires SHORTTAG YES

<h1 id="logo"><a href="http://www.ryangregson.com/blog/">The Ryan Gregson Web-

?

The construct <foo<bar> is valid in HTML (it is an example of the rather obscure “Shorttags” feature) but its use is not recommended. In most cases, this is a typo that you will want to fix. If you really want to use shorttags, be aware that they are not well implemented by browsers.

[TheDoc]

It’s because you’re using the wrong term! It can get a little confusing with text because so many things sound the same, but this is what you’re looking for:

text-indent: -9999px;

[Ranger]

that would be it, but I actually just accidently used the term "align" instead of indent on this post, not in the actual code. I’ve since edited this post to be more accurate.

[TheDoc]

Perhaps because you have it commented out?

h1#logo{display: none; /*text-indent: -9999px;*/}

[Ranger]

okay, apparently i’ve made this more complicated than I intended.
for intents and purposes we will ignore the display:none method, and just focus on the text-indent method.
here’s the new css code with the same results as before.

Code:

h1#logo{text-indent: -9999px;}

[TheDoc]

aaahhhh

Try:

h1#logo a { text-indent:-9999px; }

[Ranger]

aargh. that’s not doing it. not in IE.

[vincent]

Wrap the text in a span, so:

HTML

Code:

The Ryan Gregson Web-Log

CSS

Code:

#logo a {display:block;height:xxxpx;width:xxxpx;} Width and height of the image you are using as the link.
#logo a span {visibility:hidden;}

I didn’t try it in IE. I will in like two hours if you haven’t found the solution yet.

[Indubitable Turtle]

It appears that your opening "wrapper" div tag is missing the closing bracket. In your header.php:

Code:

/”>

Should be:

Code:

/”>

That may or may not fix your problem in IE, but it should certainly be a start, and will definitely fix the validation error! :)

[Ranger]

Wow, that sure did it. Good eye! thanks everyone for sticking with me on that.

[Author]

Posts