Page 1 of 1

weird gap in IE css

Posted: Wed Aug 09, 2006 9:19 am
by dru_nasty
feyd | Please use

Code: Select all

,

Code: Select all

and [syntax="..."] tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read:  [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url] to learn how to do it too.[/color]


Got a layout that seems to look good in all browsers cept IE.
I'm getting a gap between the header and scroller at the top part of the page. See it [url]http://www.fivestarsports.net[/url] The reason it doesn't go all the way across the screen is i have a y tiling bg image in my wrapper div so that my columns cascade evenly. Anywho I have no idea what's causing this. I took out the form and everything else in that div thinking that was causing it but i still have a gap.

Here's the code:

Much love to whoever can figure this out.
[syntax="css"]<!--

body {
margin:0px;
background-color:#999999;
background-image:url(artwork/bg_gradient.gif);
background-repeat:repeat-x;
}

.wrapper {
width:760px;
position:absolute;
left:50%;
margin-left:-380px;
padding:0px;
border:0px;
background:url(artwork/bg_strip.gif);
background-repeat:repeat-y;
background-position:left;
}

.top_header {
width:760px;
height:38px;
background-image:url(artwork/top_header.jpg);
background-position:top;
display:block;
}

.top_header .login{
text-align:right;
padding-right:10px;
padding-top:9px;
color:#7F97A7;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
}

.top_header .login a{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
color:#7F97A7;
text-decoration:none;
}

.top_header .login a:hover{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
color:#7F97A7;
text-decoration:underline;
}

.header{
width:760px;
display:block;
margin:0px 0px 0px 0px;
}

.scroller{
width:760px;
height:20px;
/*display:block;*/
background-color:#000000;
color:#FFFFFF;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
margin:0px 0px 0px 0px;
}

.user_info{
width:760px;
height:28px;
background-color:#000000;
text-align:left;
/*border-top:1px dotted #333;*/
}

.user_info .login{
color:#ffffff;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
/*padding-top:3px;*/
padding-left:10px;
background-color:#000000;
}

.user_info .login a{
color:#7F97A7;
text-decoration:none;
}

.user_info .login a:hover{
color:#7F97A7;
text-decoration:underline;
}

.gradient{
display:inline;
}


.menuHead {
color:#7F97A7;
font-size:13px;
font-family:Verdana, Arial, Helvetica, sans-serif;
text-decoration:none;
margin-left:10px;
line-height:20px;
}

.menuOption {
color:#ffffff;
font-size:11px;
font-family:Verdana, Arial, Helvetica, sans-serif;
margin-left:15px;
line-height:18px;
text-decoration:none;
}

#menu1 {display:none;}
#menu2 {display:none;}
#menu3 {display:none;}
#menu4 {display:none;}
#menu5 {display:none;}
#menu6 {display:none;}
#menu7 {display:none;}

.navbar_left{
width: 180px;
float: left;
padding-top:10px;
background-color:#000000;
margin:0px 0px 0px 0px;
}

.navbar_left a:hover {
text-decoration:underline;
color:#7F97A7;
}

.content {
width:580px;
float:right;
background-color:#ffffff;
margin:0px 0px 0px 0px;
}

.content .author {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
line-height:17px;
font-weight:normal;
padding-left:10px;
color:#666666;
}

.content .header {
margin: 10px 10px 10px 10px;
padding-top: 10px;
display:inline;
}

.content .table1 {
padding:0px 50px 0px 50px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
}

.content p{
padding-left:10px;
padding-right:15px;
color:#000000;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
line-height:17px;
text-indent:20px;
}

.content a{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
color:#003366;
text-decoration:none;
}

.content a:hover{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
color:#003366;
text-decoration:underline;
}

.content h1 {
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:17px;
font-weight:bold;
border-bottom:1px dotted;
border-top:1px dotted;
border-color:#333;
color:#2B3D5D;
padding:0px 0px 0px 10px;
margin:10px 10px 10px 10px;
/*margin-left:10px;
margin-right:10px;*/
}

.footer{
clear: both;
width:760px;
background-color:#000000;
text-align:center;
padding:10px 0 10px 0;
margin:0px;
 }

.content .results_head {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:18px;
font-weight:bold;
text-align:center;
margin-bottom:10px;
margin-top:10px;
}

.content .results_head2 {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:14px;
font-weight:bold;
text-align:center;
margin-bottom:10px;
}
.content_home {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
color:#333333;
padding:2px 6px 2px 6px;
margin-bottom:15px;
line-height:20px;
}
.content .list{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:12px;
line-height:26px;
color:#003366;
padding-left:20px;
margin-bottom:10px;
}
li {
font-weight:bold;
}

-->

feyd | Please use[/syntax]

Code: Select all

,

Code: Select all

and [syntax="..."] tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read:  [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url] to learn how to do it too.[/color]

Posted: Wed Aug 09, 2006 12:25 pm
by dru_nasty
feyd | Please use

Code: Select all

,

Code: Select all

and [syntax="..."] tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read:  [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url] to learn how to do it too.[/color]


Even though i took out anything that could possibly cause this, i'm still getting a gap between the bottom of my header and the beginning of my floats. IE is the worst.
Here's revised css if anyone cares to help: and also the new page http://www.fivestarsports.net

(and sorry Feyd, i checked the link but couldn't figure how to adjust my code to CSS)
[syntax="css"]<!--

body {
margin:0px;
background-color:#999999;
background-image:url(artwork/bg_gradient.gif);
background-repeat:repeat-x;
}

.wrapper {
width:760px;
position:absolute;
left:50%;
margin-left:-380px;
padding:0px;
border:0px;
/*background:url(artwork/bg_strip.gif);*/
background-repeat:repeat-y;
background-position:left;
}

.top_header {
width:760px;
height:38px;
background-image:url(artwork/top_header.jpg);
background-position:top;
display:block;
}

.top_header .login{
text-align:right;
padding-right:10px;
padding-top:9px;
color:#7F97A7;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
}

.top_header .login a{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
color:#7F97A7;
text-decoration:none;
}

.top_header .login a:hover{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
color:#7F97A7;
text-decoration:underline;
}

.header{
width:760px;
margin:0px 0px 0px 0px;
}

.scroller{
width:760px;
height:20px;
/*display:block;*/
background-color:#000000;
color:#FFFFFF;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
margin:0px 0px 0px 0px;
}

.user_info{
width:760px;
height:28px;
background-color:#000000;
text-align:left;
/*border-top:1px dotted #333;*/
}

.user_info .login{
color:#ffffff;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
/*padding-top:3px;*/
padding-left:10px;
background-color:#000000;
}

.user_info .login a{
color:#7F97A7;
text-decoration:none;
}

.user_info .login a:hover{
color:#7F97A7;
text-decoration:underline;
}

.gradient{
display:inline;
}


.menuHead {
color:#7F97A7;
font-size:13px;
font-family:Verdana, Arial, Helvetica, sans-serif;
text-decoration:none;
margin-left:10px;
line-height:20px;
}

.menuOption {
color:#ffffff;
font-size:11px;
font-family:Verdana, Arial, Helvetica, sans-serif;
margin-left:15px;
line-height:18px;
text-decoration:none;
}

#menu1 {display:none;}
#menu2 {display:none;}
#menu3 {display:none;}
#menu4 {display:none;}
#menu5 {display:none;}
#menu6 {display:none;}
#menu7 {display:none;}

.navbar_left{
width: 180px;
float: left;
background-color:#000000;
margin:0px 0px 0px 0px;
}

.navbar_left a:hover {
text-decoration:underline;
color:#7F97A7;
}

.content {
width:580px;
float:right;
background-color:#ffffff;
margin:0px 0px 0px 0px;
}

.content .author {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
line-height:17px;
font-weight:normal;
padding-left:10px;
color:#666666;
}

.content .header {
margin: 0px 10px 10px 10px;
padding-top: 0px;
display:inline;
}

.content .table1 {
padding:0px 50px 0px 50px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
}

.content p{
padding-left:10px;
padding-right:15px;
color:#000000;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
line-height:17px;
text-indent:20px;
}

.content a{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
color:#003366;
text-decoration:none;
}

.content a:hover{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
color:#003366;
text-decoration:underline;
}

.content h1 {
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:17px;
font-weight:bold;
border-bottom:1px dotted;
border-top:1px dotted;
border-color:#333;
color:#2B3D5D;
padding:0px 0px 0px 10px;
margin:10px 10px 10px 10px;
/*margin-left:10px;
margin-right:10px;*/
}

.footer{
clear: both;
width:760px;
background-color:#000000;
text-align:center;
padding:10px 0 10px 0;
margin:0px;
 }

.content .results_head {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:18px;
font-weight:bold;
text-align:center;
margin-bottom:10px;
margin-top:10px;
}

.content .results_head2 {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:14px;
font-weight:bold;
text-align:center;
margin-bottom:10px;
}
.content_home {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
color:#333333;
padding:2px 6px 2px 6px;
margin-bottom:15px;
line-height:20px;
}
.content .list{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:12px;
line-height:26px;
color:#003366;
padding-left:20px;
margin-bottom:10px;
}
li {
font-weight:bold;
}

-->

feyd | Please use[/syntax]

Code: Select all

,

Code: Select all

and [syntax="..."] tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read:  [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url] to learn how to do it too.[/color]

Posted: Wed Aug 09, 2006 12:54 pm
by feyd
If you edit your post, you'll find [sytnax="css"]around your code[/syntax]

Posted: Wed Aug 09, 2006 1:03 pm
by AKA Panama Jack
If you want people to use the [syntax] bbcode you might want to add a dropdown selection on the post/edit message page so people know it is available and the syntax that is supported. Otherwise you WILL be posting your wraparound message on many posts.

Also your link to "Posting code in the forums" mentions absolutely nothing about the [syntax] bbcode.

Posted: Wed Aug 09, 2006 1:30 pm
by dru_nasty
k, thanks for clearing up the syntax tags for me ;).

As for my IE/CSS issues, problem fixed. I had to declare my header as a bg image in my css as opposed to adding it via the img tag in html. IE RULES!

Posted: Wed Aug 09, 2006 1:31 pm
by feyd
AKA Panama Jack wrote:If you want people to use the [syntax] bbcode you might want to add a dropdown selection on the post/edit message page so people know it is available and the syntax that is supported. Otherwise you WILL be posting your wraparound message on many posts.

Also your link to "Posting code in the forums" mentions absolutely nothing about the [syntax] bbcode.
There is a drop down. .. In Sherbet.

Posted: Wed Aug 09, 2006 1:33 pm
by AKA Panama Jack
Not everyone uses that template. :)

Posted: Wed Aug 09, 2006 2:13 pm
by Weirdan
AKA Panama Jack wrote:If you want people to use the [syntax] bbcode you might want to add a dropdown selection on the post/edit message page so people know it is available and the syntax that is supported.
It's there (if you use Sherbet theme). Agreed, [syntax] should be mentioned in FAQ and subSilver should have that dropdown as well.