PDA

View Full Version : unwanted space between my center content and right content


silverglade
06-11-2009, 04:17 PM
hi, i have this unwanted space that varies between firefox and IE6 to the right of my center content on my page. i have no idea how to get rid of it, i tried resizing the div widths but it remains. i also set heights on the divs to line them up at the bottom of the page. any help greatly appreciated. thank you. derek

here is the page im talking about.

http://derekvanderven.com/computer_ecommerce/index.html

here is the css for the site and the page

@charset "utf-8";
/* CSS Document */

body {
margin: 0;
padding: 0;
font-family: Arial, Helvetica, sans-serif;
background-color: #71838A;
}
#wrapper {
overflow: auto;
margin: 0 auto 0 auto;
width: 750px;
background-color: #B0BBBF;
}
#header {
margin: 0 auto 0 auto;
background-image: url(slice_front_images/header.jpg);
background-repeat: no-repeat;
width: 750px;
height: 81px;
}
#left_nav_container{
float: left;
margin: 0 auto 0 21px;
width: 175px;
border: 1px solid #999999;
background-color: #C0C0C0;
padding-top: 20px;
}

/**********************************left links code************************/
#left_links {
width: 175px;
height: 700px;
margin: 0 auto 0 auto;
border-right: 1px solid #618EFD/*#6792FD*/;
border-left: 1px solid #618EFD/*#6792FD*/;
}

#left_links ul li a:link, #left_links ul li a:visited {
font-weight:bold;
color:#375B97;
text-decoration:none;
font-size:84%;
display:block;
height:1.8em;
}
#left_links ul li a:hover, #left_links ul li a:active{
color: #000;
text-decoration:none;
}
#left_links ul li {
position:relative;
left:-20px;
list-style-type:none;
}
/*************************************end left links*********************/

#header_image {
float: left;
width: 380px;
height: 188px;
background-image: url(images/header_image.jpg);
background-repeat: no-repeat;
border: 2px solid gray;
}
/*****************************front sales*******************************/
#front_sales_container {
float: left;
width: 380px;
height: 545px;
border: 2px solid gray;
background-color: white;
}

.front_sales_divs {
float: left;
width: 130px;
margin-top: 20px;
margin-right: auto;
margin-bottom: 20px;
margin-left: 27px;
border: 1px solid gray;
padding-bottom: 5px;
}


.front_sales_divs img {
float: right;
padding-top: 5px;
padding-right: 5px;

}
.front_sales_text {
float: left;
width: 130px;
padding-top: 5px;
padding-right: 5px;
padding-left: 5px;
padding: bottom: 5px;
font-size:70%;
line-height: 90%;


}



/*******************************footer************* ***********/
#footer {
margin: 0 auto 0 auto;
width: 750px;
color: white;
background-color: gray;
text-align: center;
}

#footer a:link , #footer a:visited {
text-decoration: none;
color: white;
}
#footer a:active, #footer a:hover {
text-decoration: none;
color: blue;
}

/************************************right content****************************/
#right_container{
float:right;
width: 180px;
border: 1px solid #999999;
background-color: #fff;
padding-top: 20px;
padding-right: 0px;
font-size: small;
padding-left: 10px;
margin-left: 0px;
font-size: 70%;
line-height: 90%;
height: 720px;
margin-top: 0px;
margin-right: 4px;
margin-bottom: 0px;
}




.right_content {
width: 160px;
border: 1px solid #999999;
margin-top: 20px;
margin-right: 5px;
margin-bottom: 0;
padding-top: 10px;
line-height: 105%;
padding-left: 0px;
}

.right_content img {
float: left;
padding-right: 10px;
}
/*************************************top links*****************************/

#toplinks {
font-weight:bold;
width:530px;
height: 25px;
float:right;
margin-top: 55px;
margin-right: 20px;
margin-bottom: 0;
margin-left: 0;
text-align: right;
}
#toplinks ul {
list-style-type:none;
margin:0;
padding:0;
font-size: 70%;
}
#toplinks ul li {
display:inline;
margin:0 3px;
line-height:1.5em;
}
#toplinks ul li a:link, #toplinks ul li a:visited {
color:#fff;
text-decoration:none;
height:1.8em;
}
#toplinks ul li a:hover, #toplinks ul li a:active{
color:#59B942;
text-decoration:none;
}
/***************************computers code**************************/

#computers_content {
margin: 0 auto 0 auto;
width: 350px;

border: 1px solid #999999;


}
#computers_content p {
padding: 20px ;
}
#computers_content img {
float: right;
padding: 20px;
border: 2px solid gray;
}

#computers_content h4 {
font-size: large;
padding: 10px;
}

#checkout {
float: left;
width: 100px;
}
#checkout img {
padding: 20px;
}

/********************************JOHNNY'S LEFT NAV***************************/

.navlist { /*needs images/borders on sides*/
/*background: url('images/nav.png') repeat-x 0 -70px;*/
width: 120px;
list-style: none;
padding: 10px 10px 0 0;
margin: 0 0 0 4px;
float: left;
border-right: 1px solid #618EFD/*#6792FD*/;
border-left: 1px solid #618EFD/*#6792FD*/;
}

.navlist li
{
display: block;
margin: 0;
padding: 0;
}

.navlist li a
{
display: block;
width: 100%;
margin: 0;
padding: 4px 6px 9px 4px;
border-top: #618EFD solid 1px;
color: #000;
text-decoration: none;
text-align: center;
}

.navlist a:hover
{
color: #fff;
background: #618EFD;
}

.navlist h3 {
width: 100%;
padding: 8px 4px 8px 4px;
margin: 0;
text-align: center;
background: #fff;
}
/*******************************cart container*********************/

#cart_container {
float: left;
width: 375px;
border: 2px solid gray;
background-color: white;
height: 545px;
}

#header_image_cart {
float: left;
width: 375px;
height: 188px;
background-image: url(images/header_image.jpg);
background-repeat: no-repeat;
border: 2px solid gray;
}


and here is the html for the page

<!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=utf-8" />
<!--[if lt IE 7]>
<link href="iefixes.css" rel="stylesheet" type="text/css" /> <![endif]-->
<link href="computer.css" rel="stylesheet" type="text/css"/>
<title>Computer Ecommerce home</title>
<style type="text/css">

.style2 {
color: #CC6600;
font-weight: bold;
}
.style3 {
color: #00CC33;
font-weight: bold;
}
</style>
</head>

<body>


<div id="wrapper">
<div id="header"><div id="toplinks">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="computers.html">| Computers</a></li><li><a href="notebooks.html">| Notebooks </a></li>
<li><a href="pda.html">| PDA</a></li>
<li><a href="cart.html">| Your Cart</a></li>
<li><a href="support.html">| Support</a></li>
</ul>
</div><!--end toplinks-->


</div><!--end header-->



<ul class="navlist">

<li><h3>Our Products</h3></li>
<li><a href="motherboards.html">Motherboards</a></li>
<li><a href="processors.html">Processors</a></li>
<li><a href="memory.html">Memory</a></li>
<li><a href="hard_drives.html">Hard Drives</a></li>
<li><a href="monitors.html">Monitors</a></li>
<li><a href="case.html">Case</a></li>
<li><a href="ups.html">UPS</a></li>
<li><a href="video_cards.html">Video Cards</a></li>
<li><a href="cd.html">CD/CDR</a></li>
<li><a href="data.html">Data Storage</a></li>
<li><a href="devices.html">I/O Devices</a></li>
<li><a href="multimedia.html">Multimedia</a></li>
<li><a href="removable.html">Removable Storage</a></li>
<li><a href="scanners.html">Scanners &amp; Printers</a></li>
<li><a href="hubs.html">Hubs and Routers</a></li>
<li><a href="speakers.html">Speakers</a></li>
<li><a href="scanners.html">Scanners</a></li>
<li><a href="hubs.html">Hubs and Routers</a></li>
</ul>
<!--end of left nav-->

<div id="header_image"></div><!--end header image-->

<div id="right_container">
<p><img src="slice_front_images/intel_image.jpg" width="173" height="86" /></p>
<p>&nbsp;</p>
<p><span class="style1"><span class="style2"> 15% discount</span>, <a href="discount.html">click here</a></span></p>
<p>0 items in your :</p>
<p align="center"><a href="cart.html">Shopping Cart</a></p>


<div class="right_content"><img src="slice_front_images/learning_center_hands.jpg"/><span class="style3">Learning Center</span><br />
<br />
<br />
<a href="learning.html">start learning!<br />
<br />
</a></div>
<!--end right content-->


<div class="right_content">
<p><img src="slice_front_images/warrantees_smile.jpg" width="64" height="68" /> <span class="style3">Warrantees</span><br />
</p>
<p><a href="warantees.html">Check out our warantees!</a> </p>
</div><!--end right content-->

<div class="right_content">

<p align="center"><a href="customer_service.html">Customer Service Home</a> <br />
</p>
<p align="center"><a href="account_info.html">Account Info</a></p>
<p align="center"><a href="downloads.html">Downloads</a></p>
<p align="center"><a href="registration.html">Product Registration</a></p>
<p align="center">&nbsp;</p>
</div><!--end right content-->



</div><!--end right container-->

<div id="front_sales_container">

<div class="front_sales_divs">
<img src="slice_front_images/computer.jpg" width="59" height="62"/>

<div class= "front_sales_text">
<strong>Dell Computer</strong> &nbsp;&nbsp;&nbsp;&nbsp;<strong>&nbsp;$999 </strong> <br />
<br />
Maybe better to build<br />
your own.<br />
</div><!--end front sales text-->

</div><!--end front sales divs-->

<div class="front_sales_divs"> <img src="slice_front_images/headphones.jpg" height= "56" />

<div class= "front_sales_text">
<strong>Cool Headphones</strong> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<strong><br />
<br />
&nbsp;$99 </strong> <br />
<br />
Quality headphones!!!<br />
</div><!--end front sales text--></div>

<div class="front_sales_divs"><img src="slice_front_images/video_card.jpg" height= "54"/>

<div class= "front_sales_text">
<strong>Nvidea video card </strong>&nbsp;&nbsp;&nbsp;&nbsp;<strong><br />
<br />
&nbsp;$299 <br />
<br />
</strong> Hottest fastest card!!</div>
<!--end front sales text--></div>

<div class="front_sales_divs"><img src="slice_front_images/monitor.jpg" height="59" / >
<div class= "front_sales_text">
<strong>Awesome Monitor </strong>&nbsp;&nbsp;&nbsp;&nbsp;<strong><br />
<br />
&nbsp;$1299<br />
<br />
</strong> Incredible monitor!!!</div>
<!--end front sales text--></div>

<div class="front_sales_divs"><img src="slice_front_images/dvd_rw.jpg" width="55" height="61" />
<div class= "front_sales_text">
<strong>Uber DVD drive!!! </strong>&nbsp;&nbsp;&nbsp;&nbsp;<strong><br />
<br />
&nbsp;$125.99<br />
<br />
</strong>This one is amazing!</div>
<!--end front sales text--></div>
<div class="front_sales_divs">

<img src="slice_front_images/Seagate_Hard_Disk.jpg"width="74" height="62" />

<div class= "front_sales_text">
<strong>Ultimate uber drive!</strong>&nbsp;&nbsp;&nbsp;<strong><br />
<br />
&nbsp;$9999999,99999.00<br />
<br />
</strong>This one is the best!</div>
</div>

</div>
<!--end front sales container-->





</div><!--end wrapper-->
<div id="footer">&copy; site design by<a href="http://derekvanderven.com"> derekvanderven.com </a></div>
<!--end footer-->
<!-- Start of StatCounter Code -->
<script type="text/javascript">
sc_project=3569481;
sc_invisible=1;
sc_partition=39;
sc_security="7e526e75";
</script>

<script type="text/javascript" src="http://www.statcounter.com/counter/counter.js"></script><noscript><div class="statcounter"><a title="free hit counter" href="http://www.statcounter.com/free_hit_counter.html" target="_blank"><img class="statcounter" src="http://c40.statcounter.com/3569481/0/7e526e75/1/" alt="free hit counter" ></a></div></noscript>
<!-- End of StatCounter Code -->
</body>
</html>

MagicPower
06-11-2009, 04:38 PM
you've got #front sales container float:letf n #right_container float:right

what about

#right_container{
float:right;
width: 180px;
border: 1px solid #999999;
background-color: #fff;
padding-top: 20px;
padding-right: 0px;
font-size: small;
font-size: 70%;
line-height: 90%;
height: 720px;
margin-top: 0px;
margin-bottom: 0px;
margin-left: 0px;
margin-right: 48px;
}

does that work

silverglade
06-11-2009, 05:24 PM
thanks it works great in firefox. but the divs pop all over in IE6.

silverglade
06-12-2009, 03:20 PM
i have it floated left now and center box pops down, i tried different positioning in code but cant get it to work. if anyone can help me id greatly appreciate it . thanks . derek

here is the new test page with the right content box floated left and the popped down center box.

http://derekvanderven.com/computer_ecommerce/index_test.html


here is the new css

@charset "utf-8";
/* CSS Document */

body {
margin: 0;
padding: 0;
font-family: Arial, Helvetica, sans-serif;
background-color: #71838A;
}
#wrapper {
overflow: auto;
margin: 0 auto 0 auto;
width: 750px;
background-color: #B0BBBF;
}
#header {
margin: 0 auto 0 auto;
background-image: url(slice_front_images/header.jpg);
background-repeat: no-repeat;
width: 750px;
height: 81px;
}
#left_nav_container{
float: left;
margin: 0 auto 0 21px;
width: 175px;
border: 1px solid #999999;
background-color: #C0C0C0;
padding-top: 20px;
}

/**********************************left links code************************/
#left_links {
width: 175px;
height: 700px;
margin: 0 auto 0 auto;
border-right: 1px solid #618EFD/*#6792FD*/;
border-left: 1px solid #618EFD/*#6792FD*/;
}

#left_links ul li a:link, #left_links ul li a:visited {
font-weight:bold;
color:#375B97;
text-decoration:none;
font-size:84%;
display:block;
height:1.8em;
}
#left_links ul li a:hover, #left_links ul li a:active{
color: #000;
text-decoration:none;
}
#left_links ul li {
position:relative;
left:-20px;
list-style-type:none;
}
/*************************************end left links*********************/

#header_image {
float: left;
width: 380px;
height: 188px;
background-image: url(images/header_image.jpg);
background-repeat: no-repeat;
border: 2px solid gray;
}
/*****************************front sales*******************************/
#front_sales_container {
float: left;
width: 380px;
height: 545px;
border: 2px solid gray;
background-color: white;
}

.front_sales_divs {
float: left;
width: 130px;
margin-top: 20px;
margin-right: auto;
margin-bottom: 20px;
margin-left: 27px;
border: 1px solid gray;
padding-bottom: 5px;
}


.front_sales_divs img {
float: right;
padding-top: 5px;
padding-right: 5px;

}
.front_sales_text {
float: left;
width: 130px;
padding-top: 5px;
padding-right: 5px;
padding-left: 5px;
padding: bottom: 5px;
font-size:70%;
line-height: 90%;


}



/*******************************footer************* ***********/
#footer {
margin: 0 auto 0 auto;
width: 750px;
color: white;
background-color: gray;
text-align: center;
}

#footer a:link , #footer a:visited {
text-decoration: none;
color: white;
}
#footer a:active, #footer a:hover {
text-decoration: none;
color: blue;
}

/************************************right content****************************/
#right_container{
float:right;
width: 180px;
border: 1px solid #999999;
background-color: #fff;
padding-top: 20px;
padding-right: 0px;
font-size: small;
padding-left: 10px;
margin-left: 0px;
font-size: 70%;
line-height: 90%;
height: 720px;
margin-top: 0px;
margin-right: 4px;
margin-bottom: 0px;
}




.right_content {
width: 160px;
border: 1px solid #999999;
margin-top: 20px;
margin-right: 5px;
margin-bottom: 0;
padding-top: 10px;
line-height: 105%;
padding-left: 0px;
}

.right_content img {
float: left;
padding-right: 10px;
}
/*************************************top links*****************************/

#toplinks {
font-weight:bold;
width:530px;
height: 25px;
float:right;
margin-top: 55px;
margin-right: 20px;
margin-bottom: 0;
margin-left: 0;
text-align: right;
}
#toplinks ul {
list-style-type:none;
margin:0;
padding:0;
font-size: 70%;
}
#toplinks ul li {
display:inline;
margin:0 3px;
line-height:1.5em;
}
#toplinks ul li a:link, #toplinks ul li a:visited {
color:#fff;
text-decoration:none;
height:1.8em;
}
#toplinks ul li a:hover, #toplinks ul li a:active{
color:#59B942;
text-decoration:none;
}
/***************************computers code**************************/

#computers_content {
margin: 0 auto 0 auto;
width: 350px;

border: 1px solid #999999;


}
#computers_content p {
padding: 20px ;
}
#computers_content img {
float: right;
padding: 20px;
border: 2px solid gray;
}

#computers_content h4 {
font-size: large;
padding: 10px;
}

#checkout {
float: left;
width: 100px;
}
#checkout img {
padding: 20px;
}

/********************************JOHNNY'S LEFT NAV***************************/

.navlist { /*needs images/borders on sides*/
/*background: url('images/nav.png') repeat-x 0 -70px;*/
width: 120px;
list-style: none;
padding: 10px 10px 0 0;
margin: 0 0 0 4px;
float: left;
border-right: 1px solid #618EFD/*#6792FD*/;
border-left: 1px solid #618EFD/*#6792FD*/;
}

.navlist li
{
display: block;
margin: 0;
padding: 0;
}

.navlist li a
{
display: block;
width: 100%;
margin: 0;
padding: 4px 6px 9px 4px;
border-top: #618EFD solid 1px;
color: #000;
text-decoration: none;
text-align: center;
}

.navlist a:hover
{
color: #fff;
background: #618EFD;
}

.navlist h3 {
width: 100%;
padding: 8px 4px 8px 4px;
margin: 0;
text-align: center;
background: #fff;
}
/*******************************cart container*********************/

#cart_container {
float: left;
width: 375px;
border: 2px solid gray;
background-color: white;
height: 545px;
}

#header_image_cart {
float: left;
width: 375px;
height: 188px;
background-image: url(images/header_image.jpg);
background-repeat: no-repeat;
border: 2px solid gray;
}
and here is the new html

<!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=utf-8" />
<!--[if lt IE 7]>
<link href="iefixes.css" rel="stylesheet" type="text/css" /> <![endif]-->
<link href="computer.css" rel="stylesheet" type="text/css"/>
<title>Computer Ecommerce home</title>
<style type="text/css">

.style2 {
color: #CC6600;
font-weight: bold;
}
.style3 {
color: #00CC33;
font-weight: bold;
}
</style>
</head>

<body>


<div id="wrapper">
<div id="header"><div id="toplinks">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="computers.html">| Computers</a></li><li><a href="notebooks.html">| Notebooks </a></li>
<li><a href="pda.html">| PDA</a></li>
<li><a href="cart.html">| Your Cart</a></li>
<li><a href="support.html">| Support</a></li>
</ul>
</div><!--end toplinks-->


</div><!--end header-->



<ul class="navlist">

<li><h3>Our Products</h3></li>
<li><a href="motherboards.html">Motherboards</a></li>
<li><a href="processors.html">Processors</a></li>
<li><a href="memory.html">Memory</a></li>
<li><a href="hard_drives.html">Hard Drives</a></li>
<li><a href="monitors.html">Monitors</a></li>
<li><a href="case.html">Case</a></li>
<li><a href="ups.html">UPS</a></li>
<li><a href="video_cards.html">Video Cards</a></li>
<li><a href="cd.html">CD/CDR</a></li>
<li><a href="data.html">Data Storage</a></li>
<li><a href="devices.html">I/O Devices</a></li>
<li><a href="multimedia.html">Multimedia</a></li>
<li><a href="removable.html">Removable Storage</a></li>
<li><a href="scanners.html">Scanners &amp; Printers</a></li>
<li><a href="hubs.html">Hubs and Routers</a></li>
<li><a href="speakers.html">Speakers</a></li>
<li><a href="scanners.html">Scanners</a></li>
<li><a href="hubs.html">Hubs and Routers</a></li>
</ul>
<!--end of left nav-->

<div id="header_image"></div><!--end header image-->

<div id="right_container">
<p><img src="slice_front_images/intel_image.jpg" width="173" height="86" /></p>
<p>&nbsp;</p>
<p><span class="style1"><span class="style2"> 15% discount</span>, <a href="discount.html">click here</a></span></p>
<p>0 items in your :</p>
<p align="center"><a href="cart.html">Shopping Cart</a></p>


<div class="right_content"><img src="slice_front_images/learning_center_hands.jpg"/><span class="style3">Learning Center</span><br />
<br />
<br />
<a href="learning.html">start learning!<br />
<br />
</a></div>
<!--end right content-->


<div class="right_content">
<p><img src="slice_front_images/warrantees_smile.jpg" width="64" height="68" /> <span class="style3">Warrantees</span><br />
</p>
<p><a href="warantees.html">Check out our warantees!</a> </p>
</div><!--end right content-->

<div class="right_content">

<p align="center"><a href="customer_service.html">Customer Service Home</a> <br />
</p>
<p align="center"><a href="account_info.html">Account Info</a></p>
<p align="center"><a href="downloads.html">Downloads</a></p>
<p align="center"><a href="registration.html">Product Registration</a></p>
<p align="center">&nbsp;</p>
</div><!--end right content-->



</div>

<div id="front_sales_container">

<div class="front_sales_divs">
<img src="slice_front_images/computer.jpg" width="59" height="62"/>

<div class= "front_sales_text">
<strong>Dell Computer</strong> &nbsp;&nbsp;&nbsp;&nbsp;<strong>&nbsp;$999 </strong> <br />
<br />
Maybe better to build<br />
your own.<br />
</div><!--end front sales text-->

</div><!--end front sales divs-->

<div class="front_sales_divs"> <img src="slice_front_images/headphones.jpg" height= "56" />

<div class= "front_sales_text">
<strong>Cool Headphones</strong> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<strong><br />
<br />
&nbsp;$99 </strong> <br />
<br />
Quality headphones!!!<br />
</div><!--end front sales text--></div>

<div class="front_sales_divs"><img src="slice_front_images/video_card.jpg" height= "54"/>

<div class= "front_sales_text">
<strong>Nvidea video card </strong>&nbsp;&nbsp;&nbsp;&nbsp;<strong><br />
<br />
&nbsp;$299 <br />
<br />
</strong> Hottest fastest card!!</div>
<!--end front sales text--></div>

<div class="front_sales_divs"><img src="slice_front_images/monitor.jpg" height="59" / >
<div class= "front_sales_text">
<strong>Awesome Monitor </strong>&nbsp;&nbsp;&nbsp;&nbsp;<strong><br />
<br />
&nbsp;$1299<br />
<br />
</strong> Incredible monitor!!!</div>
<!--end front sales text--></div>

<div class="front_sales_divs"><img src="slice_front_images/dvd_rw.jpg" width="55" height="61" />
<div class= "front_sales_text">
<strong>Uber DVD drive!!! </strong>&nbsp;&nbsp;&nbsp;&nbsp;<strong><br />
<br />
&nbsp;$125.99<br />
<br />
</strong>This one is amazing!</div>
<!--end front sales text--></div>
<div class="front_sales_divs">

<img src="slice_front_images/Seagate_Hard_Disk.jpg"width="74" height="62" />

<div class= "front_sales_text">
<strong>Ultimate uber drive!</strong>&nbsp;&nbsp;&nbsp;<strong><br />
<br />
&nbsp;$9999999,99999.00<br />
<br />
</strong>This one is the best!</div>
</div>

</div>

<!--end right container-->


<!--end front sales container-->





</div><!--end wrapper-->
<div id="footer">&copy; site design by<a href="http://derekvanderven.com"> derekvanderven.com </a></div>
<!--end footer-->
<!-- Start of StatCounter Code -->
<script type="text/javascript">
sc_project=3569481;
sc_invisible=1;
sc_partition=39;
sc_security="7e526e75";
</script>

<script type="text/javascript" src="http://www.statcounter.com/counter/counter.js"></script><noscript><div class="statcounter"><a title="free hit counter" href="http://www.statcounter.com/free_hit_counter.html" target="_blank"><img class="statcounter" src="http://c40.statcounter.com/3569481/0/7e526e75/1/" alt="free hit counter" ></a></div></noscript>
<!-- End of StatCounter Code -->
</body>
</html>

MagicPower
06-12-2009, 04:05 PM
modified css


@charset "utf-8";
/* CSS Document */

body {
margin: 0;
padding: 0;
font-family: Arial, Helvetica, sans-serif;
background-color: #71838A;
}
#wrapper {
overflow: auto;
margin: 0 auto 0 auto;
width: 750px;
background-color: #B0BBBF;
}
#header {
margin: 0 auto 0 auto;
background-image: url(slice_front_images/header.jpg);
background-repeat: no-repeat;
width: 750px;
height: 81px;
}
#left_nav_container{
float: left;
margin: 0 auto 0 21px;
width: 175px;
border: 1px solid #999999;
background-color: #C0C0C0;
padding-top: 20px;
}

/**********************************left links code************************/
#left_links {
width: 175px;
height: 700px;
margin: 0 auto 0 auto;
border-right: 1px solid #618EFD/*#6792FD*/;
border-left: 1px solid #618EFD/*#6792FD*/;
}

#left_links ul li a:link, #left_links ul li a:visited {
font-weight:bold;
color:#375B97;
text-decoration:none;
font-size:84%;
display:block;
height:1.8em;
}
#left_links ul li a:hover, #left_links ul li a:active{
color: #000;
text-decoration:none;
}
#left_links ul li {
position:relative;
left:-20px;
list-style-type:none;
}
/*************************************end left links*********************/

#header_image {
float: left;
width: 380px;
height: 188px;
background-image: url(images/header_image.jpg);
background-repeat: no-repeat;
border: 2px solid gray;
}
/*****************************front sales*******************************/
#front_sales_container {
width: 380px;
height: 545px;
border: 2px solid gray;
background-color: white;
float: left;
}

.front_sales_divs {
float: left;
width: 130px;
margin-top: 20px;
margin-right: auto;
margin-bottom: 20px;
margin-left: 27px;
border: 1px solid gray;
padding-bottom: 5px;
}


.front_sales_divs img {
float: right;
padding-top: 5px;
padding-right: 5px;

}
.front_sales_text {
float: left;
width: 130px;
padding-top: 5px;
padding-right: 5px;
padding-left: 5px;
padding: bottom: 5px;
font-size:70%;
line-height: 90%;


}



/*******************************footer************* ***********/
#footer {
margin: 0 auto 0 auto;
width: 750px;
color: white;
background-color: gray;
text-align: center;
}

#footer a:link , #footer a:visited {
text-decoration: none;
color: white;
}
#footer a:active, #footer a:hover {
text-decoration: none;
color: blue;
}

/************************************right content****************************/
#right_container{
float:right;
width: 180px;
border: 1px solid #999999;
background-color: #fff;
padding-top: 20px;
padding-right: 0px;
font-size: small;
font-size: 70%;
line-height: 90%;
height: 720px;
padding-left: 10px;
margin: 0px;
}
#rightcontainer {
float: left;
height: 720px;
width: 180px;
padding-top: 20px;
padding-left: 10px;
font-size: 70%;
line-height: 90%;
background-color: #FFF;
margin: 0px;
border: 1px solid #999999;
}





.right_content {
width: 160px;
border: 1px solid #999999;
margin-top: 20px;
margin-right: 5px;
margin-bottom: 0;
padding-top: 10px;
line-height: 105%;
padding-left: 0px;
}

.right_content img {
float: left;
padding-right: 10px;
}
/*************************************top links*****************************/

#toplinks {
font-weight:bold;
width:530px;
height: 25px;
float:right;
margin-top: 55px;
margin-right: 20px;
margin-bottom: 0;
margin-left: 0;
text-align: right;
}
#toplinks ul {
list-style-type:none;
margin:0;
padding:0;
font-size: 70%;
}
#toplinks ul li {
display:inline;
margin:0 3px;
line-height:1.5em;
}
#toplinks ul li a:link, #toplinks ul li a:visited {
color:#fff;
text-decoration:none;
height:1.8em;
}
#toplinks ul li a:hover, #toplinks ul li a:active{
color:#59B942;
text-decoration:none;
}
/***************************computers code**************************/

#computers_content {
margin: 0 auto 0 auto;
width: 350px;

border: 1px solid #999999;


}
#computers_content p {
padding: 20px ;
}
#computers_content img {
float: right;
padding: 20px;
border: 2px solid gray;
}

#computers_content h4 {
font-size: large;
padding: 10px;
}

#checkout {
float: left;
width: 100px;
}
#checkout img {
padding: 20px;
}

/********************************JOHNNY'S LEFT NAV***************************/

.navlist { /*needs images/borders on sides*/
/*background: url('images/nav.png') repeat-x 0 -70px;*/
width: 120px;
list-style: none;
padding: 10px 10px 0 0;
margin: 0 0 0 4px;
float: left;
border-right: 1px solid #618EFD/*#6792FD*/;
border-left: 1px solid #618EFD/*#6792FD*/;
}

.navlist li
{
display: block;
margin: 0;
padding: 0;
}

.navlist li a
{
display: block;
width: 100%;
margin: 0;
padding: 4px 6px 9px 4px;
border-top: #618EFD solid 1px;
color: #000;
text-decoration: none;
text-align: center;
}

.navlist a:hover
{
color: #fff;
background: #618EFD;
}

.navlist h3 {
width: 100%;
padding: 8px 4px 8px 4px;
margin: 0;
text-align: center;
background: #fff;
}
/*******************************cart container*********************/

#cart_container {
float: left;
width: 375px;
border: 2px solid gray;
background-color: white;
height: 545px;
}

#header_image_cart {
float: left;
width: 375px;
height: 188px;
background-image: url(images/header_image.jpg);
background-repeat: no-repeat;
border: 2px solid gray;
}


modified html

<!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=UTF-8">
<!--[if lt IE 7]>
<link href="iefixes.css" rel="stylesheet" type="text/css" /> <![endif]-->
<link href="index_test_files/computer_test.css" rel="stylesheet" type="text/css">
<title>Computer Ecommerce home</title>
<style type="text/css">

.style2 {
color: #CC6600;
font-weight: bold;
}
.style3 {
color: #00CC33;
font-weight: bold;
}
</style>
</head><body>


<div id="wrapper">
<div id="header"><div id="toplinks">
<ul>
<li><a href="http://derekvanderven.com/computer_ecommerce/index.html">Home</a></li>
<li><a href="http://derekvanderven.com/computer_ecommerce/computers.html">| Computers</a></li><li><a href="http://derekvanderven.com/computer_ecommerce/notebooks.html">| Notebooks </a></li>
<li><a href="http://derekvanderven.com/computer_ecommerce/pda.html">| PDA</a></li>
<li><a href="http://derekvanderven.com/computer_ecommerce/cart.html">| Your Cart</a></li>
<li><a href="http://derekvanderven.com/computer_ecommerce/support.html">| Support</a></li>
</ul>
</div><!--end toplinks-->


</div><!--end header-->



<ul class="navlist">

<li><h3>Our Products</h3></li>
<li><a href="http://derekvanderven.com/computer_ecommerce/motherboards.html">Motherboards</a></li>
<li><a href="http://derekvanderven.com/computer_ecommerce/processors.html">Processors</a></li>
<li><a href="http://derekvanderven.com/computer_ecommerce/memory.html">Memory</a></li>
<li><a href="http://derekvanderven.com/computer_ecommerce/hard_drives.html">Hard Drives</a></li>
<li><a href="http://derekvanderven.com/computer_ecommerce/monitors.html">Monitors</a></li>
<li><a href="http://derekvanderven.com/computer_ecommerce/case.html">Case</a></li>
<li><a href="http://derekvanderven.com/computer_ecommerce/ups.html">UPS</a></li>
<li><a href="http://derekvanderven.com/computer_ecommerce/video_cards.html">Video Cards</a></li>
<li><a href="http://derekvanderven.com/computer_ecommerce/cd.html">CD/CDR</a></li>
<li><a href="http://derekvanderven.com/computer_ecommerce/data.html">Data Storage</a></li>
<li><a href="http://derekvanderven.com/computer_ecommerce/devices.html">I/O Devices</a></li>
<li><a href="http://derekvanderven.com/computer_ecommerce/multimedia.html">Multimedia</a></li>
<li><a href="http://derekvanderven.com/computer_ecommerce/removable.html">Removable Storage</a></li>
<li><a href="http://derekvanderven.com/computer_ecommerce/scanners.html">Scanners &amp; Printers</a></li>
<li><a href="http://derekvanderven.com/computer_ecommerce/hubs.html">Hubs and Routers</a></li>
<li><a href="http://derekvanderven.com/computer_ecommerce/speakers.html">Speakers</a></li>
<li><a href="http://derekvanderven.com/computer_ecommerce/scanners.html">Scanners</a></li>
<li><a href="http://derekvanderven.com/computer_ecommerce/hubs.html">Hubs and Routers</a></li>
</ul>
<!--end of left nav-->

<div id="header_image"></div><!--end header image-->
<div id="front_sales_container">

<div class="front_sales_divs">
<img src="index_test_files/computer.jpg" height="62" width="59">

<div class="front_sales_text">
<strong>Dell Computer</strong> &nbsp;&nbsp;&nbsp;&nbsp;<strong>&nbsp;$999 </strong> <br>
<br>
Maybe better to build<br>
your own.<br>
</div><!--end front sales text-->

</div><!--end front sales divs-->

<div class="front_sales_divs"> <img src="index_test_files/headphones.jpg" height="56">

<div class="front_sales_text">
<strong>Cool Headphones</strong> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<strong><br>
<br>
&nbsp;$99 </strong> <br>
<br>
Quality headphones!!!<br>
</div><!--end front sales text--></div>

<div class="front_sales_divs"><img src="index_test_files/video_card.jpg" height="54">

<div class="front_sales_text">
<strong>Nvidea video card </strong>&nbsp;&nbsp;&nbsp;&nbsp;<strong><br>
<br>
&nbsp;$299 <br>
<br>
</strong> Hottest fastest card!!</div>
<!--end front sales text--></div>

<div class="front_sales_divs"><img src="index_test_files/monitor.jpg" height="59">
<div class="front_sales_text">
<strong>Awesome Monitor </strong>&nbsp;&nbsp;&nbsp;&nbsp;<strong><br>
<br>
&nbsp;$1299<br>
<br>
</strong> Incredible monitor!!!</div>
<!--end front sales text--></div>

<div class="front_sales_divs"><img src="index_test_files/dvd_rw.jpg" height="61" width="55">
<div class="front_sales_text">
<strong>Uber DVD drive!!! </strong>&nbsp;&nbsp;&nbsp;&nbsp;<strong><br>
<br>
&nbsp;$125.99<br>
<br>
</strong>This one is amazing!</div>
<!--end front sales text--></div>
<div class="front_sales_divs">

<img src="index_test_files/Seagate_Hard_Disk.jpg" height="62" width="74">

<div class="front_sales_text">
<strong>Ultimate uber drive!</strong>&nbsp;&nbsp;&nbsp;<strong><br>
<br>
&nbsp;$9999999,99999.00<br>
<br>
</strong>This one is the best!</div>
</div>

</div>

<div id="rightcontainer"><img src="index_test_files/intel_image.jpg" alt="pic" width="173" height="86" />
<p><span class="style1"><span class="style2">15% discount</span>, <a href="http://derekvanderven.com/computer_ecommerce/discount.html">click here</a></span></p>
<p>0 items in your :</p>
<p align="center"><a href="http://derekvanderven.com/computer_ecommerce/cart.html">Shopping Cart</a></p>
<div class="right_content"><img src="index_test_files/learning_center_hands.jpg" alt="pic" /><span class="style3">Learning Center</span><br />
<br />
<br />
<a href="http://derekvanderven.com/computer_ecommerce/learning.html">start learning!<br />
<br />
</a></div>
<div class="right_content">
<p><img src="index_test_files/warrantees_smile.jpg" alt="pic" width="64" height="68" /> <span class="style3">Warrantees</span><br />
</p>
<p><a href="http://derekvanderven.com/computer_ecommerce/warantees.html">Check out our warantees!</a></p>
</div>
<div class="right_content">
<p align="center"><a href="http://derekvanderven.com/computer_ecommerce/customer_service.html">Customer Service Home</a> <br />
</p>
<p align="center"><a href="http://derekvanderven.com/computer_ecommerce/account_info.html">Account Info</a></p>
<p align="center"><a href="http://derekvanderven.com/computer_ecommerce/downloads.html">Downloads</a></p>
<p align="center"><a href="http://derekvanderven.com/computer_ecommerce/registration.html">Product Registration</a></p>
<p align="center">&nbsp;</p>
</div>
</div>
<!--end right container-->


<!--end front sales container-->





</div><!--end wrapper-->
<div id="footer"> site design by<a href="http://derekvanderven.com/"> derekvanderven.com </a></div>
<!--end footer-->
<!-- Start of StatCounter Code -->
<script type="text/javascript">
sc_project=3569481;
sc_invisible=1;
sc_partition=39;
sc_security="7e526e75";
</script>

<script type="text/javascript" src="index_test_files/counter.js"></script><noscript><div
class="statcounter"><a title="free hit counter"
href="http://www.statcounter.com/free_hit_counter.html"
target="_blank"><img class="statcounter"
src="http://c40.statcounter.com/3569481/0/7e526e75/1/" alt="free hit
counter" ></a></div></noscript>
<!-- End of StatCounter Code -->
</body></html>

silverglade
06-12-2009, 04:12 PM
thank you very much. i ended up going with a right float, and widened the main content and right content div to close up the space. thanks for the help! derek

MagicPower
06-12-2009, 04:15 PM
you know the code above did you paste it over your old one?

silverglade
06-12-2009, 04:48 PM
ya thank you. i pasted it but it didnt get rid of the space. now my only problem is i have scrollbars in internet explorer 6. any advice appreciated if you can.


here is the new css

@charset "utf-8";
/* CSS Document */

body {
margin: 0;
padding: 0;
font-family: Arial, Helvetica, sans-serif;
background-color: #71838A;
}
#wrapper {
overflow: auto;
margin: 0 auto 0 auto;
width: 750px;
background-color: #B0BBBF;
}
#header {
margin: 0 auto 0 auto;
background-image: url(slice_front_images/header.jpg);
background-repeat: no-repeat;
width: 750px;
height: 81px;
}
#left_nav_container{
float: left;
margin: 0 auto 0 21px;
width: 175px;
border: 1px solid #999999;
background-color: #C0C0C0;
padding-top: 20px;
}

/**********************************left links code************************/
#left_links {
width: 175px;
height: 700px;
margin: 0 auto 0 auto;
border-right: 1px solid #618EFD/*#6792FD*/;
border-left: 1px solid #618EFD/*#6792FD*/;
}

#left_links ul li a:link, #left_links ul li a:visited {
font-weight:bold;
color:#375B97;
text-decoration:none;
font-size:84%;
display:block;
height:1.8em;
}
#left_links ul li a:hover, #left_links ul li a:active{
color: #000;
text-decoration:none;
}
#left_links ul li {
position:relative;
left:-20px;
list-style-type:none;
}
/*************************************end left links*********************/

#header_image {
float: left;
width: 380px;
height: 188px;
background-image: url(images/header_image.jpg);
background-repeat: no-repeat;
border: 2px solid gray;
}
/*****************************front sales*******************************/
#front_sales_container {
float: left;
width: 380px;
height: 545px;
border: 2px solid gray;
background-color: white;
}

.front_sales_divs {
float: left;
width: 130px;
margin-top: 20px;
margin-right: auto;
margin-bottom: 20px;
margin-left: 27px;
border: 1px solid gray;
padding-bottom: 5px;
}


.front_sales_divs img {
float: right;
padding-top: 5px;
padding-right: 5px;

}
.front_sales_text {
float: left;
width: 130px;
padding-top: 5px;
padding-right: 5px;
padding-left: 5px;
padding: bottom: 5px;
font-size:70%;
line-height: 90%;


}



/*******************************footer************* ***********/
#footer {
margin: 0 auto 0 auto;
width: 750px;
color: white;
background-color: gray;
text-align: center;
}

#footer a:link , #footer a:visited {
text-decoration: none;
color: white;
}
#footer a:active, #footer a:hover {
text-decoration: none;
color: blue;
}

/************************************right content****************************/
#right_container{
float: right;
clear: right;
width: 210px;
border: 1px solid #999999;
background-color: #fff;
padding-top: 20px;
padding-right: 0px;
font-size: small;
padding-left: 10px;
margin-left: 0px;
font-size: 70%;
line-height: 90%;
height: 720px;
margin-top: 0px;
margin-right: 4px;
margin-bottom: 0px;
}




.right_content {
width: 160px;
border: 1px solid #999999;
margin-top: 20px;
margin-right: 5px;
margin-bottom: 0;
padding-top: 10px;
line-height: 105%;
padding-left: 0px;
}

.right_content img {
float: left;
padding-right: 10px;
}
/*************************************top links*****************************/

#toplinks {
font-weight:bold;
width:530px;
height: 25px;
float:right;
margin-top: 55px;
margin-right: 20px;
margin-bottom: 0;
margin-left: 0;
text-align: right;
}
#toplinks ul {
list-style-type:none;
margin:0;
padding:0;
font-size: 70%;
}
#toplinks ul li {
display:inline;
margin:0 3px;
line-height:1.5em;
}
#toplinks ul li a:link, #toplinks ul li a:visited {
color:#fff;
text-decoration:none;
height:1.8em;
}
#toplinks ul li a:hover, #toplinks ul li a:active{
color:#59B942;
text-decoration:none;
}
/***************************computers code**************************/

#computers_content {
margin: 0 auto 0 auto;
width: 350px;

border: 1px solid #999999;


}
#computers_content p {
padding: 20px ;
}
#computers_content img {
float: right;
padding: 20px;
border: 2px solid gray;
}

#computers_content h4 {
font-size: large;
padding: 10px;
}

#checkout {
float: left;
width: 100px;
}
#checkout img {
padding: 20px;
}

/********************************JOHNNY'S LEFT NAV***************************/

.navlist { /*needs images/borders on sides*/
/*background: url('images/nav.png') repeat-x 0 -70px;*/
width: 120px;
list-style: none;
padding: 10px 10px 0 0;
margin: 0 0 0 4px;
float: left;
clear: left;
border-right: 1px solid #618EFD/*#6792FD*/;
border-left: 1px solid #618EFD/*#6792FD*/;
}

.navlist li
{
display: block;
margin: 0;
padding: 0;
}

.navlist li a
{
display: block;
width: 100%;
margin: 0;
padding: 4px 6px 9px 4px;
border-top: #618EFD solid 1px;
color: #000;
text-decoration: none;
text-align: center;
}

.navlist a:hover
{
color: #fff;
background: #618EFD;
}

.navlist h3 {
width: 100%;
padding: 8px 4px 8px 4px;
margin: 0;
text-align: center;
background: #fff;
}
/*******************************cart container*********************/

#cart_container {
float: left;
width: 340px;
border: 2px solid gray;
background-color: white;
height: 545px;
}

#header_image_cart {
float: left;
width: 385;
height: 188px;
background-image: url(images/header_image.jpg);
background-repeat: no-repeat;
border: 2px solid gray;
}


and here is the new html

<!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=utf-8" />
<!--[if lt IE 7]>
<link href="iefixes.css" rel="stylesheet" type="text/css" /> <![endif]-->
<link href="computer_test.css" rel="stylesheet" type="text/css"/>
<title>Computer Ecommerce home</title>
<style type="text/css">

.style2 {
color: #CC6600;
font-weight: bold;
}
.style3 {
color: #00CC33;
font-weight: bold;
}
</style>
</head>

<body>


<div id="wrapper">
<div id="header"><div id="toplinks">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="computers.html">| Computers</a></li><li><a href="notebooks.html">| Notebooks </a></li>
<li><a href="pda.html">| PDA</a></li>
<li><a href="cart.html">| Your Cart</a></li>
<li><a href="support.html">| Support</a></li>
</ul>
</div><!--end toplinks-->


</div><!--end header-->



<ul class="navlist">

<li><h3>Our Products</h3></li>
<li><a href="motherboards.html">Motherboards</a></li>
<li><a href="processors.html">Processors</a></li>
<li><a href="memory.html">Memory</a></li>
<li><a href="hard_drives.html">Hard Drives</a></li>
<li><a href="monitors.html">Monitors</a></li>
<li><a href="case.html">Case</a></li>
<li><a href="ups.html">UPS</a></li>
<li><a href="video_cards.html">Video Cards</a></li>
<li><a href="cd.html">CD/CDR</a></li>
<li><a href="data.html">Data Storage</a></li>
<li><a href="devices.html">I/O Devices</a></li>
<li><a href="multimedia.html">Multimedia</a></li>
<li><a href="removable.html">Removable Storage</a></li>
<li><a href="scanners.html">Scanners &amp; Printers</a></li>
<li><a href="hubs.html">Hubs and Routers</a></li>
<li><a href="speakers.html">Speakers</a></li>
<li><a href="scanners.html">Scanners</a></li>
<li><a href="hubs.html">Hubs and Routers</a></li>
</ul>
<!--end of left nav-->

<div id="header_image"></div><!--end header image-->

<div id="right_container">
<p><img src="slice_front_images/intel_image.jpg" width="173" height="86" /></p>
<p>&nbsp;</p>
<p><span class="style1"><span class="style2"> 15% discount</span>, <a href="discount.html">click here</a></span></p>
<p>0 items in your :</p>
<p align="center"><a href="cart.html">Shopping Cart</a></p>


<div class="right_content"><img src="slice_front_images/learning_center_hands.jpg"/><span class="style3">Learning Center</span><br />
<br />
<br />
<a href="learning.html">start learning!<br />
<br />
</a></div>
<!--end right content-->


<div class="right_content">
<p><img src="slice_front_images/warrantees_smile.jpg" width="64" height="68" /> <span class="style3">Warrantees</span><br />
</p>
<p><a href="warantees.html">Check out our warantees!</a> </p>
</div><!--end right content-->

<div class="right_content">

<p align="center"><a href="customer_service.html">Customer Service Home</a> <br />
</p>
<p align="center"><a href="account_info.html">Account Info</a></p>
<p align="center"><a href="downloads.html">Downloads</a></p>
<p align="center"><a href="registration.html">Product Registration</a></p>
<p align="center">&nbsp;</p>
</div><!--end right content-->



</div>

<div id="front_sales_container">

<div class="front_sales_divs">
<img src="slice_front_images/computer.jpg" width="59" height="62"/>

<div class= "front_sales_text">
<strong>Dell Computer</strong> &nbsp;&nbsp;&nbsp;&nbsp;<strong>&nbsp;$999 </strong> <br />
<br />
Maybe better to build<br />
your own.<br />
</div><!--end front sales text-->

</div><!--end front sales divs-->

<div class="front_sales_divs"> <img src="slice_front_images/headphones.jpg" height= "56" />

<div class= "front_sales_text">
<strong>Cool Headphones</strong> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<strong><br />
<br />
&nbsp;$99 </strong> <br />
<br />
Quality headphones!!!<br />
</div><!--end front sales text--></div>

<div class="front_sales_divs"><img src="slice_front_images/video_card.jpg" height= "54"/>

<div class= "front_sales_text">
<strong>Nvidea video card </strong>&nbsp;&nbsp;&nbsp;&nbsp;<strong><br />
<br />
&nbsp;$299 <br />
<br />
</strong> Hottest fastest card!!</div>
<!--end front sales text--></div>

<div class="front_sales_divs"><img src="slice_front_images/monitor.jpg" height="59" / >
<div class= "front_sales_text">
<strong>Awesome Monitor </strong>&nbsp;&nbsp;&nbsp;&nbsp;<strong><br />
<br />
&nbsp;$1299<br />
<br />
</strong> Incredible monitor!!!</div>
<!--end front sales text--></div>

<div class="front_sales_divs"><img src="slice_front_images/dvd_rw.jpg" width="55" height="61" />
<div class= "front_sales_text">
<strong>Uber DVD drive!!! </strong>&nbsp;&nbsp;&nbsp;&nbsp;<strong><br />
<br />
&nbsp;$125.99<br />
<br />
</strong>This one is amazing!</div>
<!--end front sales text--></div>
<div class="front_sales_divs">

<img src="slice_front_images/Seagate_Hard_Disk.jpg"width="74" height="62" />

<div class= "front_sales_text">
<strong>Ultimate uber drive!</strong>&nbsp;&nbsp;&nbsp;<strong><br />
<br />
&nbsp;$9999999,99999.00<br />
<br />
</strong>This one is the best!</div>
</div>

</div>

<!--end right container-->


<!--end front sales container-->





</div><!--end wrapper-->
<div id="footer">&copy; site design by<a href="http://derekvanderven.com"> derekvanderven.com </a></div>
<!--end footer-->
<!-- Start of StatCounter Code -->
<script type="text/javascript">
sc_project=3569481;
sc_invisible=1;
sc_partition=39;
sc_security="7e526e75";
</script>

<script type="text/javascript" src="http://www.statcounter.com/counter/counter.js"></script><noscript><div class="statcounter"><a title="free hit counter" href="http://www.statcounter.com/free_hit_counter.html" target="_blank"><img class="statcounter" src="http://c40.statcounter.com/3569481/0/7e526e75/1/" alt="free hit counter" ></a></div></noscript>
<!-- End of StatCounter Code -->
</body>
</html>

MagicPower
06-12-2009, 05:22 PM
horrizontal or verticle?

silverglade
06-12-2009, 05:30 PM
i get both horizontal and vertical scrollbars in IE6. here is the page as it looks now.

http://derekvanderven.com/computer_ecommerce/index.html

MagicPower
06-12-2009, 05:37 PM
site looks fine. the only scroll bar i can see is the vertical one, ur probably getting the horizontal 1 due to monitor resulotion.

silverglade
06-12-2009, 05:51 PM
i got lazy. i added this code to the wrapper.

overflow-x: hidden;
overflow-y: hidden;
and scrolls went away.