Posted by joemoraca on May 24, 2012 at 3:11pm
you have heard the story before site works great in Chrome / Firefox / android phone / Kindle Fire and even IE 7 (changing mode in IE9 developer tools) but is broken in IE 8 and 9.
I have tried everything I can think of but the row heights just don't work right.
http://pookieschmookie.com/ right on the front page.
I took over the site mostly themed and no one had ever tried testing with IE so you can't hurt my feelings if you see something dumb.
PS Murillo is my dog ;-)
you can contact me privately at joemoraca @ gmail.com
Comments
I've seen this before but
I've seen this before but can't remember the exact circumstances. As I recall, it adds heights of the individual child elements to the height of the floating parent. You may want to check:
style.css:405
.view-pet-wall .views-row h3 {
color: white;
margin: 0 4px 1px 0px;
padding-top: 10px;
font-size: 14px;
position: relative;
z-index: 11;
}
Something about position relative and floats in IE but can't remember exactly.
--
Digital Frontiers Media
In any case, I don't think
In any case, I don't think those 2 lines are needed.
--
Digital Frontiers Media
yes those were left over
yes those were left over "turds" from some things I was trying I removed them.
if I change to have a height at the parent level I get the correct height block but just see the color - the content is still way below what is visible.
.view-pet-wall .views-row {
border:0;
padding: 0;
width:360px;
/* height: 180px; */
position: relative;
float:left;
color:#eee;
margin:10px;
overflow:hidden;
}
somehow my content height is messing with IE to cause it to ignore the heights I have for each color div
Joe Moraca
WebDevGeeks.com
Thanks to Digital Frontiers
Thanks to Digital Frontiers Media for solving the problem with a 'strategic' clearfix.
Joe Moraca
WebDevGeeks.com
You are quite welcome.
You are quite welcome. Nobody should have to face IE alone. :-D
--
Digital Frontiers Media