weird gap in IE css

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
dru_nasty
Forum Commoner
Posts: 81
Joined: Sat Sep 10, 2005 10:26 am

weird gap in IE css

Post 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]
dru_nasty
Forum Commoner
Posts: 81
Joined: Sat Sep 10, 2005 10:26 am

Post 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]
User avatar
feyd
Neighborhood Spidermoddy
Posts: 31559
Joined: Mon Mar 29, 2004 3:24 pm
Location: Bothell, Washington, USA

Post by feyd »

If you edit your post, you'll find [sytnax="css"]around your code[/syntax]
User avatar
AKA Panama Jack
Forum Regular
Posts: 878
Joined: Mon Nov 14, 2005 4:21 pm

Post 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.
dru_nasty
Forum Commoner
Posts: 81
Joined: Sat Sep 10, 2005 10:26 am

Post 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!
User avatar
feyd
Neighborhood Spidermoddy
Posts: 31559
Joined: Mon Mar 29, 2004 3:24 pm
Location: Bothell, Washington, USA

Post 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.
User avatar
AKA Panama Jack
Forum Regular
Posts: 878
Joined: Mon Nov 14, 2005 4:21 pm

Post by AKA Panama Jack »

Not everyone uses that template. :)
User avatar
Weirdan
Moderator
Posts: 5978
Joined: Mon Nov 03, 2003 6:13 pm
Location: Odessa, Ukraine

Post 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.
Post Reply