Hi
IE6,7 are givimg me grieves on browser display. I didnt have prblems with Safari nor FF. I'm not a CSS expert and in need of advice for this column alignment issues on IE. And I don't know where to begin because I've tried messing around with the css files and the css browser selector javascript and still I can't get it to work on IE.
The problems I believe center around id doc, bd, yui-main, yui-b, box and box-titles. For unclear reasons, the sizes show differently in IE from other better browsers. The sizes width and height values are different.
<div id="doc" class="yui-t2">
<div id="bd">
<div id="yui-main">
<div class="yui-b">
<div id="header" class="yui-g">
<a href="index.php">
: :
unfortunately, the 2 css files are a little overwhelming over me to understand. I tried pasting it here but the format got out of whacked.
Could someone lend a helping hand ?
Any help is appreciated.
app.css
body { font-size: 85%; font-family: "georgia"; }
.yui-t2, #bd, #yui-main { z-index: -5; }
.yui-b, .yui-g { z-index: auto; } div.yui-b div.box { color: #333333; border: 1px solid #c6e1ec; /* this controls the left boxes on front page */ margin-top: 15px; }
div.yui-b div p.box-title {
/* background: #0590C7;
border-bottom: 2px solid #c6e1ec; */
background: #6f6f6f;
border-bottom: 2px solid #c6e1ec;
color: #FFFFFF;
display: block;
font-size: 93%;
font-weight: bold;
margin: 1px;
padding: 2px 10px;
}
div.yui-b div ul { margin: 0; }
div.yui-b div ul li { border-bottom: 0px solid #fff; list-style-type: none; }
div.yui-b div ul li a { color: #333333; display: block; text-decoration: none; padding: 3px 10px; }
div.yui-b div ul li a:hover { background: #c6e1ec; color: #333333; }
grids-min.css
body {text-align:center;}
doc,#doc2,#doc3,#doc4,.yui-t1,.yui-t2,.yui-t3,.yui-t4,.yui-t5,.yui-t6,.yui-t7
{margin:auto;text-align:left;width:57.69em;*width:56.301em;min-width:750px;}
.yui-b{position:relative;} .yui-b{_position:static;}
yui-main .yui-b{position:static;}
yui-main
{width:100%;}
.yui-t1 #yui-main,.yui-t2 #yui-main,.yui-t3 #yui-main {float:right;margin-left:-25em;}
.yui-t4 #yui-main,.yui-t5 #yui-main,.yui-t6 #yui-main {float:left;margin-right:-25em;}
: : more but format is bad over here at stackoverflow to make it readable.
I apologise for I don't wish to come across in this post as unhelpful or rude.
Sincerely