Here's the issue (broken on left, working in FF2, IE7, etc on right):
Ok, so here's the code snippets...
(yes, it's non-standard, but I will argue the SEO logic elsewhere)
HTML:
Expand|Select|Wrap|Line Numbers
- <div id="header">
- <a href="/" class="logo">LogOn.ie</a>
- <strong>Internet Marketing Specialists</strong>
Expand|Select|Wrap|Line Numbers
- #header
- {
- width: 935px;
- padding: 0 4px;
- height: 186px;
- position: absolute;
- top: 0;
- left: 0;
- background: url(images/bg-header.gif);
- }
- a.logo,
- #header strong
- {
- display: block;
- text-indent: -9999px;
- overflow: hidden;
- }
- a.logo
- {
- background: url(images/logo.jpg);
- width: 309px;
- height: 128px;
- top: 20px;
- left: 34px;
- position: absolute;
- }
- #header strong
- {
- background: url(images/header-text.gif);
- width: 550px;
- height: 42px;
- top: 60px;
- left: 371px;
- position: absolute;
- }
Actual HTML is at www.logon.ie
Actual CSS is at style.css
Any advice?