...

View Full Version : CSS Image Gallery not working in IE



renee
12-06-2006, 08:35 PM
Hello,

I just love this script from Dynamic Drive. But I can't get it to work in IE. It's all wonkie in IE. :confused:

All I did was add a scrolling div to enclose the 'gallerycontainer div' 'cause there's so many links. It works fine in FF and Netscape.

You can view my page here
http://www.members.shaw.ca/sashachan/traits.html

Would really appreciate your suggestions and help please.

renee

harbingerOTV
12-07-2006, 01:30 AM
replace this:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">


with this:



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">


Doctypes are important because it tells the browser how to interpret your code. by using a strict doctype, your telling them to do exactly what you tell them.

renee
12-07-2006, 04:59 AM
Hello harbingerOTV,

Thanks for your input. I tried it out, and changing the doc type was not the result I was looking for. Hmmm.
I lose my header where my page links go, in all three browsers.
IE just center aligns everything and the links still don't work. :(
You can see the page here http://members.shaw.ca/sashachan/traitstrict.html

Thanks for having a look.
PS
I really can appreciate your sig... too funny grrr...

renee
12-07-2006, 05:45 AM
Just cleaned up the validation errors on both pages :)
But it still doesn't work.

harbingerOTV
12-07-2006, 12:44 PM
Looking at it, somewhere adn i guess in the sasha.css, you'cve used text align center. on thi spage add:


#content {
text-align: left;
}


and that will set everythign after the center back to the left.

Saw the validation got better. good work. Did you validate your css?



Errors
URI : file://localhost/TextArea

* Line: 15 Context : div#nav

Invalid number : top only 0 can be a length. You must put an unit after your number : 50



so change that to:


div#nav{
position:absolute;
top:50px;
left:0;
width:100%;
height:75px;
}


and your nav drop into place.

With strict it tries to follow all the rules. with no doctype or a transitional/loose doctype, it's forgiving.

with strict if you say top: 50; it wants to know 50 what?! em? pt? %? px?

tell it what you want it to be.

The tother thing I see your trying to do is have a fixed header. It's most likely impossible on this page. Since you have to relative position your gallery container in order to absolute position the spans on hover, IE lte 6 is going to fiv the div with the links in it. You can ignore I Eon this if you really wan tot have a fixed header. Add z-index: 2; to the div#gh\header so that everythign slides under it n page scroll.

personally I wouldn't worry about the fixed positioning. Can't see how the page benifits from it really. thats just me.

give all that a go and see what it does for you.

renee
12-08-2006, 06:39 PM
Hi harbingerOTV,

The text-align: left worked but the script still isn't functioning. Specified size em? pt? %? px; thanks. I checked css both inline/external no error or warnings. css and html validates.
The changed the css fixed header code, scrolls better. So I've sacrificed using the image script on that page for now. Feeling that some css and div ideas aren't compatible. Still playing with it tho as I liked the layout better.

Thanks tons for your time.
renee



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum