eaglesoars
Member
Posted 10 months ago #
I'm new really to theme designing and have come quite some way in designing this one (here is a link to the zip file, so you can look at all my files in detail if you want). I'm testing this locally, rather than on a live site unfortunately, but I'm having some major render problems in Firefox and Opera (probably Safari also, not tested yet) that I'm not having in IE or Chrome (working perfectly there). In firefox, everything is out of place and featured posts don't render at all, and in Opera the problem is more minor, only the footer doesn't render properly. I was wondering if there are any glaring problems in my theme (or any other issue you can think of) that may help me in resolving these issues.
Thanks for your time!
Did you try validating your markup & CSS?
eaglesoars
Member
Posted 10 months ago #
How can I do that? I'm sorry for sounding so stupid, and probably doing what you experienced guys would consider wasting your time :-/.
eaglesoars
Member
Posted 10 months ago #
Alright, I've been through the process and fixed all the problems that I can see related to the header, but no luck. I've included some screen shots below to aid the process.
The first is of firefox, which shows how it renders there (wrong, obviously) and the second is of chrome, where it renders correctly:
https://picasaweb.google.com/109170713217297764827/AftermatterQA#5759102420551503122
https://picasaweb.google.com/109170713217297764827/AftermatterQA#5759102415946759810
eaglesoars
Member
Posted 10 months ago #
Just another quick update, I've managed to fix the problem with Opera with some heavy CSS workarounds, but the padding/margins seem to be twice the size on Opera than that of other browsers.. Anyone know why this is? Also, I'm still looking for some help for the above problem, since I have no idea what is going on.
Are you using a css reset? It can help avoid some of the style -margins, paddings, default font-sizes- the browsers apply automatically, sometimes those default style can cause all kinds of issues.
eaglesoars
Member
Posted 10 months ago #
I'm not actually, I might try that, but why would it cause such great problems as in the images I posted above?!
Yeah, it might be. Anyway, your problem it's the float on the #header div. Try removing it and you'll see it fine on firefox (Haven't tested on the others)
eaglesoars
Member
Posted 10 months ago #
I found that removing the float on the #banner div fixed the entire problem, for some reason. Thanks for all your help!