1 reply [Last post]
mintcondition
mintcondition's picture
Offline
newbie
Garland, TX
Last seen: 11 years 6 days ago
Garland, TX
Timezone: GMT-5
Joined: 2009-09-20
Posts: 1
Points: 0

Apparently IE does not render CSS correctly like it should (surprise surprise) and is not displaying my rollover buttons.

Well, the buttons are being displayed, but there is no rollover state to them. If you view my website in Firefox, or any other browser except IE:

http://mintcondition.comicgenesis.com

You can see all the buttons have a rollover state. If you view it in IE, all the buttons have a rollover state except the navigation buttons for the comic. I can't figure out why.

Here is the CSS and HTML in question:

CSS:

Quote:

#firstday
{
display: block;

background: url("http://mintcondition.comicgenesis.com/workspace/webpages/index/first_day3.png") no-repeat 0 0;

}

#firstday:hover
{

background-position: 0 -43px;

}

#previousday
{
display: block;

background: url("http://mintcondition.comicgenesis.com/workspace/webpages/index/previous_day3.png") no-repeat 0 0;

}

#previousday:hover
{

background-position: 0 -43px;

}

HTML:

Quote:
***first_day***

And here is my entire stylesheet and html for the main page:

Quote:

Quote:

***advertisement***

:: Mint Condition: The Webcomic - Updates Mondays and Thursdays ::

Cast

Links

Store

Forum

Archives

Extras

Mint Condition Customs

Contact

***first_day***
***previous_day***

Random

Discuss

***todays_date***

***todays_comics***

Share This Comic:

Submit This Comic to Stumbleupon!

Submit This Comic to Delicious!

Submit This Comic to Reddit!

Submit This Comic to Digg!

Submit This Comic to Twitter!

Submit This Comic to Facebook!

// <\/scr";
s += "ipt>";
document.write(s);
// ]]>

Project Wonderful -

Your ad here, right now, for as low as $0.01

***first_day***
***previous_day***

Random

Discuss

Mint Condition Customs

Your browser does not support iframes.

Your browser does not support iframes.

Follow me on </p />
<p>Twitter!

Sorry, your browser doesn't seem to support IFrames!

Mint

Condition is

hosted on Comic Genesis, a free webhosting and site

automation service for

webcomics.

Mint Condition Studios

All content and

images are Copyright

© 2007 - 2009 John Harmon Mint Condition Studios except where specifically noted

otherwise.

RSS Feed | News Feed | Announcements | Creator | Site Design | Webmaster: John

Harmon

var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));

try {
var pageTracker = _gat._getTracker("UA-8085200-1");
pageTracker._trackPageview();
} catch(err) {}

I think the reason for this is because in all the other buttons, I have the css id included in a link tag, but in the comic navigation buttons they're included in a div and I think that's the problem IE is having (And keep in mind I have IE 8 and this is still a problem).

The reason I did this differently is because what the DIV tag is wrapped around.

Quote:
***first_day***

I can't include a link tag wrapped around it, because ***first_day*** is a template tag that the site my comic is hosted on uses and is rendered as its own link so it would be wrapping a link tag around a preexisting link (which I even tried) and it just messes everything up.

I would like to keep CSS rollovers, since they seem to be better than javascript rollovers. So I was wondering if there was a way to make it work in IE without including the CSS id in a link tag wrapped around the comic nav buttons. I know most people now don't even use IE, I just want my site to be the same in all browsers.

And if you really read all that then congratulations. And thank you.

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 5 years 37 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

You very badly need to

You very badly need to validate your code, frankly it's a mess. The very first two lines of a document are a DTD statement and the parent document node 'html' you have half a lifetime of code before either of these two figure.

Please run your page through the W3C validator for markup not CSS, see what if any errors you can sort out. If the code is generated by your hosting service
<center>***advertisement***</center> this should not be on the page where it is if at all, then you will need to change to a real host that doesn't insert junk into your pages.

P.S for posting code please use [ code ] tags not [ quote ] tags

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me