I'm hoping someone can help me with this one.
I am developing a new layout for a site http://dev.nexgenbalers.com/ and I am having a fiddly little problem with two floated columns on the home page in IE 7.
I did the standard trick using width: 50% !important; width:49.9%; which is working great in every browser with the exception of IE 7. Now at first glance depending on your browsers viewport size things may seem just fine, however if you start adjusting your browser width the right news column drops below the Image gallery column at certain widths. I'm sure there's a logical reason for this but I have yet to figure it out.
Thanks in advance,
Rick
If anyone feels like looking at this
Just in case anyone takes a look at this I have decided to restrict access using an .htaccess file. You can use the following to get in:
User Name:admin
Password:test
Thanks!
Width
Hey Rick...
My first guess here (as it always is with IE problems) is that it's a width problem. The column isn't going right because it's too wide.
In looking at your CSS you have both columns at 50% (adding up to 100%)...however you haven't left any room for borders/padding/margin. IE calculates these IN ADDITION to your width. So, even a 1px border/padding/margin on those would make this happen. Try setting your width to 40% on those just to test it out.
Ok...weird, as I wrote this, it seems to have fixed itself....did you just find the problem? I was going to suggest further possibilities, but maybe you don't need them :)
*EDIT: Ok, it's not fixed :) It changes depending on the size of the browser window that's open...this confirms that it's most likely a width problem (percentages are evil, IMO :) )
-Rob Feature
Geeks and God Co-Host
www.mustardseedmedia.com
I Agree... Evil!
Thanks for checking this out Rob. I agree this is an evil problem. Thing is I put in the !important hack to give < IE7 browsers a width of 49.9% and that's working fine. Firefox and other standards compliant browsers are getting 50% and it's fine on everything but IE7 and I made sure to eliminate any margins, padding, borders etc.
I dunno I'm stumped. I guess I might have to go less than 50% in IE 7 and have a slight gap in elements on the page.
Thanks again!