hello,
I am encouintering some difficulties, adapting a template to firefox and IE.
I thought I had finished but then firefox 2.0 and IE 7.0 were finished and now my template has 3 different looks :-(
I am in need of someone who can have a look at http://sibiu.zice.ro with different browsers and give me some hints how to correct the obvious glitches. There are some misalignments/positioning and some background problems.
Maybe you can give a a good web design forum where I can ask around?
Looks fine in my FF2 on WinXP.
There seems to be some small problems with the padding or margin around most DIVs in IE7.
yeah, ff2 is ok, ff1.x ok too, IE 7.0 some padding probs and a horizontal line between header image and main blog
IE6 => big padding probs, main part is bigger => middle sidebar goes down to the footer...
any hints, websites, forums where I can document myself?
Yeah, I see how it's off in IE (the IE tab for FF rocks my socks).
I would google IE padding bug and see where that leads you. Also see if you can validate hte page. I feel your pain, though.
google did not give me much feedback I could use, ther are a lot of bugs out there...
I tried to validate but get a lot of errors not related to the design, but to different plugin outputs... started adapting some of those...not yet finished
btw. all my divs have padding:0px; set.... so the error seems not to be there? I'm little confused...
What about margins? There's something in the way IE handles adding up margins and padding that is off. What about ones that are not declared? I think (fuzzy head here) IE assigns a default value, unless you tell it it's 0.
I am on my way working this out :-)
I started setting default values of "0" in all my div elements, now I see that indeed it seems that FF takes the width of a div I specify and substracts the padding while IE adds the padding to the width thus pushing my objects around ;-)
Now I am off to do some serious reading on how to prevent this - thx for getting me started.
ok, I narrowed the problem down:
it is indeed the problem with IE and ff handling the box model differently...
strangely the problem is bigger with IE6 than with IE7 although it persists.
I tried one of the IE hacks for IE5 but that did not work out so if someone willing to help out could have another look I'd be very grateful... maybe someone can give me a link to a good web design forum where I could read and ask around more?
I think I am going crazy, I finally managed to get the site working in IE 6 it looks perfect now but still in IE7 I have some "smaller" problems with my middle sidebar.
for all those interested here is the fix concerning padding/margin and IE6:
#divname {
padding: 10px;
width: 760px; //IE width
}
html>body #divname {
width:780px; //rest of the world width
}
I'll explain this exampel a little bit: IE picks up the 760 width because it does not udnerstand the html>body syntax and as IE adds the padding to the width => 760px+10px left+10px right=780px
Firefox picks up the second more specific width of 780px and substracts the padding from it to get the max. width for the content.
so everything is fine.
