andrewf10
asked on
how to get rid of horizontal scroll bar in Dreamweaver 8?
Hello,
i'm developing a website in DW8 and at this stage i got front alomost page designed. Its got two columns, one is used for navigation buttons the other one for page contents, also i got a banner on the top of the page and a footer at the bottom. all of this is wrapped in #wrapper. by some strange reason horizontal scroll bar has appeared and there is about 20px of white space between the edge of #wrapper and the edge of the window. i have #wrapper width set to 100%, all margins and padding values are set to 0. could somebody help me with this?
thanks.
i'm developing a website in DW8 and at this stage i got front alomost page designed. Its got two columns, one is used for navigation buttons the other one for page contents, also i got a banner on the top of the page and a footer at the bottom. all of this is wrapped in #wrapper. by some strange reason horizontal scroll bar has appeared and there is about 20px of white space between the edge of #wrapper and the edge of the window. i have #wrapper width set to 100%, all margins and padding values are set to 0. could somebody help me with this?
thanks.
ASKER
thanks guys, this is the html code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>CTG</title>
<link rel="stylesheet" href="3col_leftNav.css" type="text/css" />
<style type="text/css">
<!--
.style1 {color: #FFFF00}
.style2 {color: #003366}
.style4 {color: #FFFFFF}
.style5 {color: #CCCCCC}
-->
</style>
</head>
<body>
<div id="wrapper">
<div id="banner">
<table border="0" cellpadding="0" cellspacing="0" width="100%" bgcolor="003366">
<!-- fwtable fwsrc="banner1.png" fwbase="banner1.jpg" fwstyle="Dreamweaver" fwdocid = "122164889" fwnested="0" -->
<tr>
<td><img src="assets/banner sliced html/spacer.gif" alt="" name="undefined_2" width="211" height="1" border="0" id="undefined_2" /></td>
<td><img src="assets/banner sliced html/spacer.gif" alt="" name="undefined_2" width="347" height="1" border="0" id="undefined_2" /></td>
<td><img src="assets/banner sliced html/spacer.gif" alt="" name="undefined_2" width="212" height="1" border="0" id="undefined_2" /></td>
<td><img src="assets/banner sliced html/spacer.gif" alt="" name="undefined_2" width="1" height="1" border="0" id="undefined_2" /></td>
</tr>
<tr>
<td><img src="assets/banner sliced html/banner1_r1_c1.jpg" alt="" name="banner1_r1_c1" width="211" height="80" border="0" id="banner1_r1_c1" /></td>
<td><div align="center"><img src="assets/banner sliced html/banner1_r1_c2.jpg" alt="" name="banner1_r1_c2" width="347" height="80" border="0" id="banner1_r1_c2" /></div></td>
<td><div align="right"><img src="assets/banner sliced html/banner1_r1_c3.jpg" alt="" name="banner1_r1_c3" width="212" height="80" border="0" id="banner1_r1_c3" /></div></td>
<td><img src="assets/banner sliced html/spacer.gif" alt="" name="undefined_2" width="1" height="80" border="0" id="undefined_2" /></td>
</tr>
</table>
</div>
<!--globalnav-->
<div id="globalNav">
<div align="left"><h6><a href="#">Home</a> | <a href="#">Login</a> | <a href="#">Register</a> | <a href="#">Contacts</a> | <a href="#">About us</a> | <a href="#">My Account</a> | <a href="#">Log out</a></h6></div>
</div>
<!--globalnav end-->
<div id="pageName"><h3 class="style2"><MARQUEE direction="right" BEHAVIOR="alternate" SCROLLAMOUNT=2 SCROLLDELAY=1 width="100%">Welcome to CarTrackerGuide.com</MARQU
<!-- navbar styles -->
<div id="navBar">
<div id="search">
<form action="#">
<input name="searchFor" type="text" size="10" />
<input name="goButton" type="submit" value="search" />
</form>
</div>
<div id="sectionLinks">
<h4 class="style2" align="center">Find your car</h4>
<ul>
<li><a href="#">Search new car</a></li>
<li><a href="#">Search used car</a></li>
<li><a href="#">Search a dealer</a></li>
<li><a href="#">Section Link</a></li>
<li><a href="#">Section Link</a></li>
<li><a href="#">Section Link</a></li>
</ul>
</div>
<div class="relatedLinks">
<h4 align="center" class="style2">Related Link Category</h4>
<ul>
<li><a href="News.html" target="_blank">Latest news</a></li>
<li><a href="#">Related Link</a></li>
<li><a href="#">Related Link</a></li>
<li><a href="#">Related Link</a></li>
<li><a href="#">Related Link</a></li>
<li><a href="#">Related Link</a></li>
</ul>
</div>
<div class="relatedLinks">
<h4 align="center" class="style2">Related Link Category</h4>
<ul>
<li><a href="#">Related Link</a></li>
<li><a href="#">Related Link</a></li>
<li><a href="#">Related Link</a></li>
<li><a href="#">Related Link</a></li>
<li><a href="#">Related Link</a></li>
<li><a href="#">Related Link</a></li>
</ul>
</div>
</div>
<!--end navBar div -->
<div id="content">
<div class="feature">
<div align="left"><img src="assets/Bmw x5.jpg" width="250" height="188" /></div>
<h3>Fabulous BMW x5</h3>
<p align="left">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec molestie. Sed aliquam sem ut arcu. Phasellus sollicitudin. Vestibulum condimentum facilisis nulla. In hac habitasse platea dictumst. Nulla nonummy. Cras quis libero. Cras venenatis. Aliquam posuere lobortis pede. Nullam fringilla urna id leo. Praesent aliquet pretium erat. Praesent non odio. Pellentesque a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aliquam lacus. Mauris magna eros, semper a, t empor et, rutrum et, tortor.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec molestie. Sed aliquam sem ut arcu. Phasellus sollicitudin. Vestibulum condimentum facilisis nulla. In hac habitasse platea dictumst. Nulla nonummy. Cras quis libero. Cras venenatis. Aliquam posuere lobortis pede. Nullam fringilla urna id leo. Praesent aliquet pretium erat. Praesent non odio. Pellentesque a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aliquam lacus. Mauris magna eros, semper a, tempor et, rutrum et, tortor. </p>
</div>
<div class="story">
<div align="left"><img src="assets/5 series 250x188.jpg" width="250" height="188" /></div>
<h3>Stylish and Powerfull M5 </h3>
<p align="left">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec molestie. Sed aliquam sem ut arcu. Phasellus sollicitudin. Vestibulum condimentum facilisis nulla. In hac habitasse platea dictumst. Nulla nonummy. Cras quis libero. Cras venenatis. Aliquam posuere lobortis pede. Nullam fringilla urna id leo. Praesent aliquet pretium erat. Praesent non odio. Pellentesque a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aliquam lacus. Mauris magna eros, semper a, tempor et, rutrum et, tortor.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec molestie. Sed aliquam sem ut arcu. Phasellus sollicitudin. Vestibulum condimentum facilisis nulla. In hac habitasse platea dictumst. Nulla nonummy. Cras quis libero. Cras venenatis. Aliquam posuere lobortis pede. Nullam fringilla urna id leo. Praesent aliquet pretium erat. Praesent non odio. Pellentesque a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aliquam lacus. Mauris magna eros, semper a, tempor et, rutrum et, tortor. </p>
</div>
</div>
<!--end content -->
<div id="footer">
<div align="left"><h1><img src="" width="44" height="22" /><a href="#">About Us</a> | <a href="#">Site Map</a> | <a href="#">Privacy Policy</a> | <a href="#">Contact Us</a> | ©2006 CarTrackerGuide.com </h1> </div></div>
<br />
</div> <!-- end of wrapper-->
</body>
</html>
and here is CSS code:
body{
font-family: Arial,sans-serif;
line-height: 1.166;
margin: 0px;
padding: 0px;
/*border-right:100px #CCCCCC;*/
}
a:link{
color:#003366;
text-decoration: none;
}
a:visited{
color:#003366;
text-decoration: none;
}
a:hover{
color:#003366;
text-decoration: underline;
}
h1{
font-family: Arial, Helvetica, sans-serif;
font-size: 80%;
color: #0000FF;
margin: 0px;
padding: 0px;
font-weight: normal;
}
h2{
font-family: Arial,sans-serif;
font-size: 114%;
color: #006699;
margin: 0px;
padding: 0px;
}
h3{
font-family: Arial,sans-serif;
font-size: 120%;
color: #FFFFFF;
margin: 0px;
padding: 0px;
}
h4{
font-family: Arial,sans-serif;
font-size: 100%;
font-weight: bold;
color: #333333;
margin: 0px;
padding: 0px;
}
h5{
font-family: Verdana,Arial,sans-serif;
font-size: 100%;
color: #334d55;
margin: 0px;
padding: 0px;
}
h6{
font-family: Arial,sans-serif;
font-size: 80%;
color: #003366;
margin: 0px;
padding: 0px;
}
/*
ul{
list-style-type: square;
}
ul ul{
list-style-type: disc;
}
ul ul ul{
list-style-type: none;
}
*/
label{
font-family: Arial,sans-serif;
font-size: 100%;
font-weight: bold;
color: #000000;
}
/*************************
/* Layout Divs */
/*************************
#wrapper{
padding: 5px 0px 0px 0px;
border: 1px solid #003366;
width: 100%;
}
#navBar{
float: left;
width: 150px;
margin: 10px 0px 0px 0px;
padding: 0px 0px 0px 0px;
background-color: #E2E2E2;
border: 1px solid #003366;
}
#content{
float: left;
width:600px;
padding: 10px 10px 20px 10px;
height: inherit;
}
/*************************
/* Components */
/*************************
#banner{
margin: 0;
padding: 0px 0px 5px 0px;
width: 100%;
background-color: 003366;
}
/************* #globalNav styles **************/
#globalNav{
padding: 0px 0px 0px 0px;
border-bottom: 1px solid #003366;
width: 100%;
border-top: 1px solid #003366;
background-color: #99CCFF;
}
#globalNav img{
display:block;
}
#globalNav a {
font-size: 90%;
padding: 0px 4px 0px 10px;
color: #003366;
}
/*************** #pageName styles **************/
#pageName{
margin: 0px;
padding: 5px 0px 5px 10px;
border-bottom: 1px solid #003366;
}
/************** .feature styles ***************/
.feature{
font-size: 80%;
border: 1px solid #003366;
padding: 10px 10px 10px 10px;
}
.feature h3{
padding: 5px 5px 5px 5px;
text-align: center;
vertical-align: middle;
background-color: #666666;
visibility: visible;
}
.feature img{
float: left;
padding: 0px 10px 0px 0px;
}
/************** .story styles *****************/
.story{
font-size: 80%;
border: 1px solid #003366;
height: auto;
width: auto;
float: none;
padding: 10px 10px 10px 10px;
}
.story h3{
padding: 5px 5px 5px 5px;
background: #666666;
text-align: center;
clear: inherit;
border: 1px solid #003366;
}
.story img{
float:right;
padding:0px 0px 0px 10px;
}
/************* #siteInfo styles ***************/
#footer{
clear: both;
border: 1px solid #cccccc;
font-size: 75%;
color: #cccccc;
padding: 10px 0px 10px 0px;
width:100%;
}
#footer img{
padding: 4px 4px 4px 10px;
vertical-align: middle;
}
/************* #search styles ***************/
#search{
padding: 0px 0px 5px 10px;
border-bottom: 1px solid #cccccc;
font-size: 90%;
}
#search form{
margin: 0px;
padding: 5px 0px 0px 0px;
}
#search label{
display: block;
margin: 0px;
padding: 0px;
}
/*********** #navBar link styles ***********/
#navBar ul a:link, #navBar ul a:visited {
display: block;
border-left: 1px solid #003366;
border-right: 1px solid #003366;
}
#navBar ul {
list-style: none;
margin: 0;
padding: 0;
border-top: 1px solid #003366;
}
/* hack to fix IE/Win's broken rendering of block-level anchors in lists */
#navBar li {
border-bottom: 1px solid #003366;
}
/* fix for browsers that don't need the hack */
html>body #navBar li {}
/*********** #sectionLinks styles ***********/
#sectionLinks{
position: relative;
margin: 0px;
padding: 10px;
font-size: 90%;
border-bottom: 1px solid #003366;
border-top: 1px solid #003366;
}
#sectionLinks h3{
padding: 10px 0px 2px 10px;
}
#sectionLinks a {
display: block;
height: auto;
width: auto;
padding-top: 2px;
padding-right: 0px;
padding-bottom: 2px;
padding-left: 10px;
background-color: #99CCFF;
}
#sectionLinks a:hover{
background-color: #BBDDFF;
}
/*********** .relatedLinks styles ***********/
.relatedLinks{
position: relative;
margin: 0px;
font-size: 90%;
padding: 10px;
border-bottom: 1px solid #003366;
}
.relatedLinks h3{
padding: 10px 0px 2px 0px;
}
.relatedLinks a:link,
.relatedLinks a:visited {
display: block;
padding: 2px 2px 2px 10px;
background-color: #99CCFF;
}
/************** #advert styles **************/
#advert{
padding: 30px 0px 10px;
}
#advert img{
display: block;
}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>CTG</title>
<link rel="stylesheet" href="3col_leftNav.css" type="text/css" />
<style type="text/css">
<!--
.style1 {color: #FFFF00}
.style2 {color: #003366}
.style4 {color: #FFFFFF}
.style5 {color: #CCCCCC}
-->
</style>
</head>
<body>
<div id="wrapper">
<div id="banner">
<table border="0" cellpadding="0" cellspacing="0" width="100%" bgcolor="003366">
<!-- fwtable fwsrc="banner1.png" fwbase="banner1.jpg" fwstyle="Dreamweaver" fwdocid = "122164889" fwnested="0" -->
<tr>
<td><img src="assets/banner sliced html/spacer.gif" alt="" name="undefined_2" width="211" height="1" border="0" id="undefined_2" /></td>
<td><img src="assets/banner sliced html/spacer.gif" alt="" name="undefined_2" width="347" height="1" border="0" id="undefined_2" /></td>
<td><img src="assets/banner sliced html/spacer.gif" alt="" name="undefined_2" width="212" height="1" border="0" id="undefined_2" /></td>
<td><img src="assets/banner sliced html/spacer.gif" alt="" name="undefined_2" width="1" height="1" border="0" id="undefined_2" /></td>
</tr>
<tr>
<td><img src="assets/banner sliced html/banner1_r1_c1.jpg" alt="" name="banner1_r1_c1" width="211" height="80" border="0" id="banner1_r1_c1" /></td>
<td><div align="center"><img src="assets/banner sliced html/banner1_r1_c2.jpg" alt="" name="banner1_r1_c2" width="347" height="80" border="0" id="banner1_r1_c2" /></div></td>
<td><div align="right"><img src="assets/banner sliced html/banner1_r1_c3.jpg" alt="" name="banner1_r1_c3" width="212" height="80" border="0" id="banner1_r1_c3" /></div></td>
<td><img src="assets/banner sliced html/spacer.gif" alt="" name="undefined_2" width="1" height="80" border="0" id="undefined_2" /></td>
</tr>
</table>
</div>
<!--globalnav-->
<div id="globalNav">
<div align="left"><h6><a href="#">Home</a> | <a href="#">Login</a> | <a href="#">Register</a> | <a href="#">Contacts</a> | <a href="#">About us</a> | <a href="#">My Account</a> | <a href="#">Log out</a></h6></div>
</div>
<!--globalnav end-->
<div id="pageName"><h3 class="style2"><MARQUEE direction="right" BEHAVIOR="alternate" SCROLLAMOUNT=2 SCROLLDELAY=1 width="100%">Welcome to CarTrackerGuide.com</MARQU
<!-- navbar styles -->
<div id="navBar">
<div id="search">
<form action="#">
<input name="searchFor" type="text" size="10" />
<input name="goButton" type="submit" value="search" />
</form>
</div>
<div id="sectionLinks">
<h4 class="style2" align="center">Find your car</h4>
<ul>
<li><a href="#">Search new car</a></li>
<li><a href="#">Search used car</a></li>
<li><a href="#">Search a dealer</a></li>
<li><a href="#">Section Link</a></li>
<li><a href="#">Section Link</a></li>
<li><a href="#">Section Link</a></li>
</ul>
</div>
<div class="relatedLinks">
<h4 align="center" class="style2">Related Link Category</h4>
<ul>
<li><a href="News.html" target="_blank">Latest news</a></li>
<li><a href="#">Related Link</a></li>
<li><a href="#">Related Link</a></li>
<li><a href="#">Related Link</a></li>
<li><a href="#">Related Link</a></li>
<li><a href="#">Related Link</a></li>
</ul>
</div>
<div class="relatedLinks">
<h4 align="center" class="style2">Related Link Category</h4>
<ul>
<li><a href="#">Related Link</a></li>
<li><a href="#">Related Link</a></li>
<li><a href="#">Related Link</a></li>
<li><a href="#">Related Link</a></li>
<li><a href="#">Related Link</a></li>
<li><a href="#">Related Link</a></li>
</ul>
</div>
</div>
<!--end navBar div -->
<div id="content">
<div class="feature">
<div align="left"><img src="assets/Bmw x5.jpg" width="250" height="188" /></div>
<h3>Fabulous BMW x5</h3>
<p align="left">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec molestie. Sed aliquam sem ut arcu. Phasellus sollicitudin. Vestibulum condimentum facilisis nulla. In hac habitasse platea dictumst. Nulla nonummy. Cras quis libero. Cras venenatis. Aliquam posuere lobortis pede. Nullam fringilla urna id leo. Praesent aliquet pretium erat. Praesent non odio. Pellentesque a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aliquam lacus. Mauris magna eros, semper a, t empor et, rutrum et, tortor.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec molestie. Sed aliquam sem ut arcu. Phasellus sollicitudin. Vestibulum condimentum facilisis nulla. In hac habitasse platea dictumst. Nulla nonummy. Cras quis libero. Cras venenatis. Aliquam posuere lobortis pede. Nullam fringilla urna id leo. Praesent aliquet pretium erat. Praesent non odio. Pellentesque a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aliquam lacus. Mauris magna eros, semper a, tempor et, rutrum et, tortor. </p>
</div>
<div class="story">
<div align="left"><img src="assets/5 series 250x188.jpg" width="250" height="188" /></div>
<h3>Stylish and Powerfull M5 </h3>
<p align="left">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec molestie. Sed aliquam sem ut arcu. Phasellus sollicitudin. Vestibulum condimentum facilisis nulla. In hac habitasse platea dictumst. Nulla nonummy. Cras quis libero. Cras venenatis. Aliquam posuere lobortis pede. Nullam fringilla urna id leo. Praesent aliquet pretium erat. Praesent non odio. Pellentesque a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aliquam lacus. Mauris magna eros, semper a, tempor et, rutrum et, tortor.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec molestie. Sed aliquam sem ut arcu. Phasellus sollicitudin. Vestibulum condimentum facilisis nulla. In hac habitasse platea dictumst. Nulla nonummy. Cras quis libero. Cras venenatis. Aliquam posuere lobortis pede. Nullam fringilla urna id leo. Praesent aliquet pretium erat. Praesent non odio. Pellentesque a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aliquam lacus. Mauris magna eros, semper a, tempor et, rutrum et, tortor. </p>
</div>
</div>
<!--end content -->
<div id="footer">
<div align="left"><h1><img src="" width="44" height="22" /><a href="#">About Us</a> | <a href="#">Site Map</a> | <a href="#">Privacy Policy</a> | <a href="#">Contact Us</a> | ©2006 CarTrackerGuide.com </h1> </div></div>
<br />
</div> <!-- end of wrapper-->
</body>
</html>
and here is CSS code:
body{
font-family: Arial,sans-serif;
line-height: 1.166;
margin: 0px;
padding: 0px;
/*border-right:100px #CCCCCC;*/
}
a:link{
color:#003366;
text-decoration: none;
}
a:visited{
color:#003366;
text-decoration: none;
}
a:hover{
color:#003366;
text-decoration: underline;
}
h1{
font-family: Arial, Helvetica, sans-serif;
font-size: 80%;
color: #0000FF;
margin: 0px;
padding: 0px;
font-weight: normal;
}
h2{
font-family: Arial,sans-serif;
font-size: 114%;
color: #006699;
margin: 0px;
padding: 0px;
}
h3{
font-family: Arial,sans-serif;
font-size: 120%;
color: #FFFFFF;
margin: 0px;
padding: 0px;
}
h4{
font-family: Arial,sans-serif;
font-size: 100%;
font-weight: bold;
color: #333333;
margin: 0px;
padding: 0px;
}
h5{
font-family: Verdana,Arial,sans-serif;
font-size: 100%;
color: #334d55;
margin: 0px;
padding: 0px;
}
h6{
font-family: Arial,sans-serif;
font-size: 80%;
color: #003366;
margin: 0px;
padding: 0px;
}
/*
ul{
list-style-type: square;
}
ul ul{
list-style-type: disc;
}
ul ul ul{
list-style-type: none;
}
*/
label{
font-family: Arial,sans-serif;
font-size: 100%;
font-weight: bold;
color: #000000;
}
/*************************
/* Layout Divs */
/*************************
#wrapper{
padding: 5px 0px 0px 0px;
border: 1px solid #003366;
width: 100%;
}
#navBar{
float: left;
width: 150px;
margin: 10px 0px 0px 0px;
padding: 0px 0px 0px 0px;
background-color: #E2E2E2;
border: 1px solid #003366;
}
#content{
float: left;
width:600px;
padding: 10px 10px 20px 10px;
height: inherit;
}
/*************************
/* Components */
/*************************
#banner{
margin: 0;
padding: 0px 0px 5px 0px;
width: 100%;
background-color: 003366;
}
/************* #globalNav styles **************/
#globalNav{
padding: 0px 0px 0px 0px;
border-bottom: 1px solid #003366;
width: 100%;
border-top: 1px solid #003366;
background-color: #99CCFF;
}
#globalNav img{
display:block;
}
#globalNav a {
font-size: 90%;
padding: 0px 4px 0px 10px;
color: #003366;
}
/*************** #pageName styles **************/
#pageName{
margin: 0px;
padding: 5px 0px 5px 10px;
border-bottom: 1px solid #003366;
}
/************** .feature styles ***************/
.feature{
font-size: 80%;
border: 1px solid #003366;
padding: 10px 10px 10px 10px;
}
.feature h3{
padding: 5px 5px 5px 5px;
text-align: center;
vertical-align: middle;
background-color: #666666;
visibility: visible;
}
.feature img{
float: left;
padding: 0px 10px 0px 0px;
}
/************** .story styles *****************/
.story{
font-size: 80%;
border: 1px solid #003366;
height: auto;
width: auto;
float: none;
padding: 10px 10px 10px 10px;
}
.story h3{
padding: 5px 5px 5px 5px;
background: #666666;
text-align: center;
clear: inherit;
border: 1px solid #003366;
}
.story img{
float:right;
padding:0px 0px 0px 10px;
}
/************* #siteInfo styles ***************/
#footer{
clear: both;
border: 1px solid #cccccc;
font-size: 75%;
color: #cccccc;
padding: 10px 0px 10px 0px;
width:100%;
}
#footer img{
padding: 4px 4px 4px 10px;
vertical-align: middle;
}
/************* #search styles ***************/
#search{
padding: 0px 0px 5px 10px;
border-bottom: 1px solid #cccccc;
font-size: 90%;
}
#search form{
margin: 0px;
padding: 5px 0px 0px 0px;
}
#search label{
display: block;
margin: 0px;
padding: 0px;
}
/*********** #navBar link styles ***********/
#navBar ul a:link, #navBar ul a:visited {
display: block;
border-left: 1px solid #003366;
border-right: 1px solid #003366;
}
#navBar ul {
list-style: none;
margin: 0;
padding: 0;
border-top: 1px solid #003366;
}
/* hack to fix IE/Win's broken rendering of block-level anchors in lists */
#navBar li {
border-bottom: 1px solid #003366;
}
/* fix for browsers that don't need the hack */
html>body #navBar li {}
/*********** #sectionLinks styles ***********/
#sectionLinks{
position: relative;
margin: 0px;
padding: 10px;
font-size: 90%;
border-bottom: 1px solid #003366;
border-top: 1px solid #003366;
}
#sectionLinks h3{
padding: 10px 0px 2px 10px;
}
#sectionLinks a {
display: block;
height: auto;
width: auto;
padding-top: 2px;
padding-right: 0px;
padding-bottom: 2px;
padding-left: 10px;
background-color: #99CCFF;
}
#sectionLinks a:hover{
background-color: #BBDDFF;
}
/*********** .relatedLinks styles ***********/
.relatedLinks{
position: relative;
margin: 0px;
font-size: 90%;
padding: 10px;
border-bottom: 1px solid #003366;
}
.relatedLinks h3{
padding: 10px 0px 2px 0px;
}
.relatedLinks a:link,
.relatedLinks a:visited {
display: block;
padding: 2px 2px 2px 10px;
background-color: #99CCFF;
}
/************** #advert styles **************/
#advert{
padding: 30px 0px 10px;
}
#advert img{
display: block;
}
Thanks....give me a little time to play with it.
ASKER
actually there is only a pixel or two of a gap left and the scroll bar...
i hope u'll see something in this code, thanks.
i hope u'll see something in this code, thanks.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Ah-ha!
Set #wrapper to be width: auto instead of 100%. That'll do it.
Set #wrapper to be width: auto instead of 100%. That'll do it.
ASKER
it eliminates the scroll bar set #wrapper to 99% but the gap is still there. is there anyway to get rid of it? when #wrapper is set to auto on my browser scrollbar doesnt dissapear...
Which browser? I'm using FF 1.5...
ASKER
IE 6
ASKER
actually 99% will do me i'm happy enough with that as long as there is no scrollbar at the bottom. Thanks for ur help an patience. That DW is mad stuff, i wonder will i ever learn it...? :)))
This isn't a DW problem as much as it is a CSS problem. I'm now looking at the marquee tag and the doctype declaration. Will get back to you...
ASKER
jason,
thanks very much for ur help and effort, there was couple of changes in the design of the home page so i'm ok now.
thanks very much for ur help and effort, there was couple of changes in the design of the home page so i'm ok now.
You probably have a problem with something inheriting a value in the CSS. Please post the CSS and page code and we'll find it.