PDA

View Full Version : IE issues AGAIN!!!


WotNow
10-08-2009, 11:34 PM
Hi everyone, I cant believe how many times I have written into this forum with internet explorer problems. This is the page I am having problems with
http://www.kimberleywebdesign.com.au/CoolChange/contact.html

Viewed in IE 6 the divs are wrong. The div titled GoogleMaps is floated left and the div titled Karratha inside the container div Google Maps is floated right. Is there another way to have the 2 divs inside the container div sit side by side without floating anything. Should I use absolute positioning? Anyway would this fix the problem.

The worst div is the div titled enquiries that contains the form. Does IE not recognise fieldsets or legends why is the border not sitting properly? Thanks for your continued support of struggling web designers.

DWcourse
10-08-2009, 11:56 PM
Two divs will sit side by side without floating as long as they fit in the container (remember to add in padding, margin and borders to the widths).

You could also float one left and then use left-margin on the other to position it (or float right and right-margin)

And don't forget about the IE Double Margin Float Bug http://www.cssnewbie.com/double-margin-float-bug/ if that's relevant.

WotNow
10-09-2009, 02:10 AM
Hi! I have taken the floats out and left margined the karratha div and made it display inline but the left div (broome) is not sitting in the div but underneath it?????? How do I fix this?? Thanks! Also any suggestions on how to fix the div underneath i.e. the form div???

#googleMaps {
/*float:left;*/
width:920px;
height:390px;
/*margin:0 40px 40px 40px;*/
margin:0 auto;
padding:0 0 0 0;
background:#0095a1;
border: 3px solid #016269;}

#googleMaps a {
font: 1em Verdana, Arial, Helvetica, sans-serif;
margin:0;
padding: .6em 0 0 0;
color:#000;}

#googleMaps p {
font: .7em Verdana, Arial, Helvetica, sans-serif;
margin:0;
padding: .6em 0 0 0;
color:#000;}

#broome{
width:425px;
margin:0 0 0 0;
/*padding:15px 0 0 20px;*/
/*display:inline;*/}

#karratha {
width:425px;
/*float:right;*/
margin:0 0 0 455px;
/*padding:15px 20px 0 0;*/
/*clear:both;*/
display:inline;}

domedia
10-09-2009, 02:19 AM
Can you apply the updated CSS to the page you online? It's much easier to debug a page we can look at in the browser and use various browser tools.

DWcourse
10-09-2009, 02:36 AM
And exactly what problems are you trying to correct? And in which version of IE?

Also why was #googleMaps floated left originally and why are you assigning height values to your divs?