Jump to content
dev osCommerce
Forum
  • Checkout
  • Login
  • Contact Us
  • Get in touch

osCommerce

The e-commerce.

New Demo
Our Partners

site not veiwing right when window is not maximized

torrent

By torrent
in General Support

Recommended Posts

torrent

torrent

Posted
Posted

Im not sure if this is a CSS issue or a html issue, but when the window is not maximized only the content within the viewable area shows up, so when you scroll to the right everything is blank except my header.

 

Im using STS

 

This is probably something obvious but im stumped :-\

 

torrentaudio.com

 

/*
 $Id: stylesheet.css,v 1.56 2003/06/30 20:04:02 hpdl Exp $

 osCommerce, Open Source E-Commerce Solutions
 http://www.oscommerce.com

 Copyright (c) 2003 osCommerce

 Released under the GNU General Public License
*/

.boxText { font-family: Verdana, Arial, sans-serif; font-size: 10px; }
.errorBox { font-family : Verdana, Arial, sans-serif; font-size : 10px; background: #ffb3b5; font-weight: bold; }
.stockWarning { font-family : Verdana, Arial, sans-serif; font-size : 10px; color: #cc0033; }
.productsNotifications { background: #f2fff7; }
.orderEdit { font-family : Verdana, Arial, sans-serif; font-size : 10px; color: #70d250; text-decoration: underline; }
.style1 {font-family: Arial, Helvetica, sans-serif; font-size: 18px; text-decoration: bold;}
.style2 {font-family: Arial, Helvetica, sans-serif; font-size: 14px;}


body {
color: #000000;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
margin-top: 0px;
margin-left: 0px;
margin-right: 0px;
padding: 0px;
}
* {margin: 0px;padding: 0px;}
p {
padding: 5px 5px 5px 20px;
color:#000000;
font-family: "Arial, Helvetica, sans-serif";
}
a {
color:#000000;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
font-weight: bold;
}
index a {
color:#000000;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
font-weight: bold;
}
A:hover {
color: #4169E1;
text-decoration: underline;
}
#container {
background-image:url(images/containermiddle.gif);
background-repeat: repeat-y;
margin-top: 0px;
margin-left: 82px;
margin-right: 82px;
text-align: left;
width: 1000px;
padding: 0px;
}
#header{
margin-left:0px;
margin-top: 0px;
margin-right: 0px;
height: 88px;
width: 851px;
background-image:url(images/header.png);
background-repeat: no-repeat;
}
#content{  
}
#left{
width:192px;
float:left;
margin-left:4px;
margin-top: 0px;
margin-right: 0px;
}
#middle{
margin-left:200px;
margin-top: 0px;
margin-right: 0px;
width:648px;
}
#middle a{
color:#000000;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
font-weight: bold;
}

/********************* menu ****************************/
.menuheader{
width:192px;
height:33px;
background-image:url(images/menutop.gif);
display:block;
}
.menucontentleft{
width:192px;
background-image:url(images/menumiddle.gif);
padding-top:10px;
padding-left:9px;
background-repeat: repeat-y;
}
.menucontentright{
width:192px;
background-image:url(images/menumiddle.gif);
padding-top:10px;
padding-left:9px;
background-repeat: repeat-y;
}
.menucontent{
width:192px;
background-image:url(images/menumiddle.gif);
padding-top:10px;
background-repeat: repeat-y;
}.menuheader h3{
padding: 11px 0px 0px 20px;
font-family: Arial, Helvetica, sans-serif;
font-size: 18px;
font-weight: Bold;
}.menuheader h4{
padding: 10px 0px 0px 20px;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;	
}
.menufooter{
width:192px;
height:9px;
background-image:url(images/menubottom.gif);
display:block;
}
.postheader,.menuheader{
color:#cccccc;
text-transform: uppercase;
}
/********************* post ****************************/
.post{
margin-bottom:15px;
}
.postheader{
background-image:url(images/posttop.gif);
background-repeat: no-repeat;
display:block;
width:647px;
height:5px;
margin:0px
}
.postheader h1{
padding: 10px 0px 0px 20px;
font-family: Arial, Helvetica, sans-serif;
font-size: 18px;
font-weight: bold;
}

.postcontent{
background-image:url(images/postmiddle.gif);
background-repeat: repeat-y;
width:610px;
padding: 10px 10px;
padding-left: 33px;
padding-right: 10px;
}
TD.postcontent {
 font-family: Tahoma, Verdana, Arial, sans-serif;
 font-size: 12px;
 color: #000000;
 width: 647px; 
 margin-left:300px; 
}
.postfooter{
background-image:url(images/postbottom.gif);
background-repeat: no-repeat;
display:block;
width:647px;
height:9px;
}
/********************* header ****************************/
#header{
position:relative;
}
#header1{
position:relative;
}
#header ul{
position: absolute;
top:67px;
display:block;
left:620px;
}
#header ul li{
display:inline;
text-align:right;
margin:auto;
width:auto;	
}
.last{
border-right: 0px none #6b7272 !important;
}
#header ul li a{
color:#191970;
display:inline;
text-align:right;
text-decoration:none;
font-size:11px;
padding: 0px 5px;
text-transform: uppercase;
}
#header ul li a:hover{
color: #4169E1;
font-size:11px;
text-decoration:underline;
}
#header p{
top:62px;
position:absolute;
}

/********************* footer ****************************/
#footer{
width:858px;
margin-left:78px;
}
#footer ul{
display:block;
margin-left:290px;
}
#footer ul li{
display:inline;
text-align:center;
margin:auto;
width:auto;
border-right: 1px solid #6b7272;	
}

#footer ul li a{
display:inline;
text-align:center;
text-decoration:none;
padding: 0px 10px;
text-transform: uppercase;
}
#footer ul li a:hover{
text-decoration:underline;
}
#footer span{
color:#000000;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
font-weight: bold;
margin-left:320px;
width:900px;
display:block;
padding: 10px 0px;
}	
/********************* menu members ****************************/
.menu ul{
list-style-position: inside;
list-style-type: disc;
padding: 0px 0px 0px 20px;
color:#000000;
}
.menu ul li{
padding-top: 5px;
color:#000000;
}
.menu ul li a{
text-decoration:none;
padding: 0px;
text-transform: uppercase;
}
.menu ul li a:hover{
text-decoration:underline;
text-transform: uppercase;
}
.member{
display:inline;
float:left;
margin-left:10px;
}
.member span{
display:block;
text-align:center;
padding: 2px 0px 13px 0px;
text-transform: uppercase;

}
.member img{
width:75px;
height:70px;
border: solid 2px #000000;	

}
.clear{
clear:both;
}
FORM {
display: inline;
}

TR.header {
 background: #808080;
}

TR.headerNavigation {
 background: #404040;
}

TD.headerNavigation {
 font-family: Verdana, Arial, sans-serif;
 font-size: 10px;
 background: #000000;
 color: #191970;
 font-weight : bold;
}

A.headerNavigation { 
 color: #191970; 
}

A.headerNavigation:hover {
 color: #4169E1;
}

TR.headerError {
 background: #ff0000;
}

TD.headerError {
 font-family: Tahoma, Verdana, Arial, sans-serif;
 font-size: 12px;
 background: #ff0000;
 color: #000000;
 font-weight : bold;
 text-align : center;
}

TR.headerInfo {
 background: #ffffff;
}

TD.headerInfo {
 font-family: Tahoma, Verdana, Arial, sans-serif;
 font-size: 12px;
 background: #ff0000;
 color: #000000;
 font-weight: bold;
 text-align: center;
}

TR.footer {
 background: #404040;
}

TD.footer {
 font-family: Verdana, Arial, sans-serif;
 font-size: 10px;
 background: #404040;
 color: #000000;
 font-weight: bold;
}

.infoBox {
 background: none;
}

.infoBoxContents {
 background: none;
 font-family: Verdana, Arial, sans-serif;
 font-size: 10px;
}
.infoBoxNotice {
 background: #FF0000;
}

.infoBoxNoticeContents {
 background: #FF0000;
 font-family: Verdana, Arial, sans-serif;
 font-size: 10px;
}

TD.infoBoxHeading {
 font-family: Arial, Helvetica, sans-serif;
 font-size: 14px;
 font-weight: bold;
 background: #cccccc;
 color: #cc0000;
}

TD.infoBox, SPAN.infoBox {
 font-family: Verdana, Arial, sans-serif;
 font-size: 10px;
}

TR.accountHistory-odd, TR.addressBook-odd, TR.alsoPurchased-odd, TR.payment-odd, TR.productListing-odd, TR.productReviews-odd, TR.upcomingProducts-odd, TR.shippingOptions-odd {
 background: #f8f8f9;
}

TR.accountHistory-even, TR.addressBook-even, TR.alsoPurchased-even, TR.payment-even, TR.productListing-even, TR.productReviews-even, TR.upcomingProducts-even, TR.shippingOptions-even {
 background: #f8f8f9;
}

TABLE.productListing {
 border: 1px;
 border-style: solid;
 border-color: #b6b7cb;
 border-spacing: 1px;
}

.productListing-heading {
 font-family: Verdana, Arial, sans-serif;
 font-size: 10px;
 background: #b6b7cb;
 color: #FFFFFF;
 font-weight: bold;
}

TD.productListing-data {
 font-family: Verdana, Arial, sans-serif;
 font-size: 10px;
}

TD.productListing-data p {
	  margin:2px;
	  padding:0;
	  text-align:center;
}

A.pageResults {
 color: #0000FF;
}

A.pageResults:hover {
 color: #0000FF;
 background: #FFFF33;
}

TD.pageHeading, DIV.pageHeading {
 font-family: Verdana, Arial, sans-serif;
 font-size: 20px;
 font-weight: bold;
 color: #000000;
}

TR.subBar {
 background: #f4f7fd;
}

TD.subBar {
 font-family: Verdana, Arial, sans-serif;
 font-size: 10px;
 color: #000000;
}

TD.main, P.main {
 font-family: Verdana, Arial, sans-serif;
 line-height: 1.5;
 padding-left: 10px;
}
TD.main1, P.main1 {
 font-family: Verdana, Arial, sans-serif;
 line-height: 1.5;
}

TD.smallText, SPAN.smallText, P.smallText {
 font-family: Verdana, Arial, sans-serif;
 font-size: 10px;
}

TD.accountCategory {
 font-family: Verdana, Arial, sans-serif;
 font-size: 13px;
 color: #aabbdd;
}

TD.fieldKey {
 font-family: Verdana, Arial, sans-serif;
 font-size: 12px;
 font-weight: bold;
}

TD.fieldValue {
 font-family: Verdana, Arial, sans-serif;
 font-size: 12px;
}

TD.tableHeading {
 font-family: Verdana, Arial, sans-serif;
 font-size: 12px;
 font-weight: bold;
}

SPAN.newItemInCart {
 font-family: Verdana, Arial, sans-serif;
 font-size: 10px;
 color: #ff0000;
}

CHECKBOX, INPUT, RADIO, SELECT {
 font-family: Verdana, Arial, sans-serif;
 font-size: 11px;
}

TEXTAREA {
 width: 100%;
 font-family: Verdana, Arial, sans-serif;
 font-size: 11px;
}

SPAN.greetUser {
 font-family: Verdana, Arial, sans-serif;
 font-size: 13px;
 color: #000000;
 font-weight: bold;
}

TABLE.formArea {
 background: #f1f9fe;
 border-color: #7b9ebd;
 border-style: solid;
 border-width: 1px;
}

TD.formAreaTitle {
 font-family: Tahoma, Verdana, Arial, sans-serif;
 font-size: 12px;
 font-weight: bold;
}

SPAN.markProductOutOfStock {
 font-family: Tahoma, Verdana, Arial, sans-serif;
 font-size: 12px;
 color: #c76170;
 font-weight: bold;
}

SPAN.productSpecialPrice {
 font-family: Verdana, Arial, sans-serif;
 color: #ff0000;
}

SPAN.errorText {
 font-family: Verdana, Arial, sans-serif;
 color: #ff0000;
}

.moduleRow { }
.moduleRowOver { background: #D7E9F7; cursor: pointer; cursor: hand; }
.moduleRowSelected { background: #E9F4FC; }

.checkoutBarFrom, .checkoutBarTo { font-family: Verdana, Arial, sans-serif; font-size: 10px; color: #8c8c8c; }
.checkoutBarCurrent { font-family: Verdana, Arial, sans-serif; font-size: 10px; color: #000000; }

/* message box */

.messageBox { font-family: Verdana, Arial, sans-serif; font-size: 10px; }
.messageStackError, .messageStackWarning { font-family: Verdana, Arial, sans-serif; font-size: 10px; background: #ff0000; }
.messageStackSuccess { font-family: Verdana, Arial, sans-serif; font-size: 10px; background: #ff0000; }

/* input requirement */

.inputRequirement { font-family: Verdana, Arial, sans-serif; font-size: 10px; color: #ff0000; }

/*-------------------------------------*/
/*   Horizontal Drop-Down Menu Style   */
/*-------------------------------------*/

.horbar	{   /* Color of main horizontal menubar and border */
color: black;
background-color: #e6e7e6;
border: 1px outset #525252;
}

.horizitem	{		  /* Behaviour of main horizontal menu items, leave as is for proper operation */
float: left;
white-space: nowrap;
}

.horizitem a {			  /* Font style, size of submenu items */
 font-family: Verdana, Arial, sans-serif;
font-size: 12px;	
text-decoration: none;
position: relative;	
display: block;	
}

.horizitem a:link, .horizitem a:visited 	{	  /* Font style & color of main menu items */
color: #000000;
text-decoration: none;
}

.horizitem a:hover	{	   /* Font style & color, background menu color of main menu item when hovered over */
color: #ffffff;
background-color: #21459c;
text-decoration: none;
}

.horizitem a:active	{	   /* Font style & color, background menu color of main menu item when clicked */
color: #ffff00;
background-color: #666666;	
text-decoration: none;
}

.horizsubmenu	{	   /* Behaviour of sub-menu items - leave as is for proper operation of submenus */
position: absolute;
left: 0;
top: 0;
visibility: hidden;
}

.horizsubframe	{	  /* Color of submenu item and border */
background-color: #e6e7e6;
border: 2px outset #fdfefd;

position: relative;
display: block;	
}

.horizsubitem	{	   /* Behaviour of sub-menu items - leave as is for proper operation of submenus */
text-align: left;
white-space: nowrap;
}

.horizsubitem a {			/* Font style, size of submenu items */
 font-family: Verdana, Arial, sans-serif;
font-size: 12px;	
text-decoration: none;

position: relative;
display: block;	
}

.horizsubitem a:link, .horizsubitem a:visited	{	   /* Font color, style of submenu items */
color: #000000;
font-size: 12px;	
text-decoration: none;
}

.horizsubitem a:hover	{	  /* Font color, style, background submenu color of submenu item when hovered over */
color: #ffffff;
background-color: #21459c;
text-decoration: none;
}

.horizsubitem a:active	{	  /* Font color, style, background submenu color of submenu item when clicked */
color: #ffff00;
background-color: #666666;		
text-decoration: none;
}

.horizsubitem .horizfwdarr, .horizitem .horizfwdarr	{	  /* Positioning of right arrow for submenus */
position: absolute;
top: 5px;
right: 8px;
}

.dmselected {   /* Style override for selected category tree */
background-color: #ccc;
	font-weight: bold;
}

.horbar .dmselected {   /* Style override for selected root category */
background-color: #999;
}


/*---------------------------------*/
/*   Vertical Fly-Out Menu Style   */
/*---------------------------------*/

.verbar	{   /* Color of main vertical menubar and border */
color: black;
background-color: #e6e7e6;
border: 1px outset #fdfefd;
}

.vertitem	{		  /* Behaviour of main vertical menu items, leave as is for proper operation */
text-align: left;
white-space: nowrap;
}

.vertitem	a {   /* Font style, size of main menu items */
 font-family: Verdana, Arial, sans-serif;
font-size: 12px;		
text-decoration: none;
position: relative;
display: block;		
}

.vertitem a:link, .vertitem a:visited	{   /* Default font style & color of main menu items */
color: #000000;
text-decoration: none;	
}

.vertitem a:hover	{   /* Font style & color, background menu color of main menu item when hovered over */
color: #ffffff;
background-color: #21449c;
text-decoration: none;
}

.vertitem a:active	{   /* Font style & color, background menu color of main menu item when clicked */
color: #ffff00;
background-color: #666666;	
text-decoration: none;	
}

.vertsubmenu	{   /* Behaviour of sub-menu  - leave as is for proper operation of submenus */
position: absolute;
left: 0;
top: 0;
visibility: hidden;
}

.vertsubframe	{   /* Color of submenu item and border */
background-color: #e6e7e6;
border: 2px outset #fdfefd;

position: relative;
display: block;	
}

.vertsubitem	{	 /* Behaviour of sub-menu  - leave as is for proper operation of submenus */
text-align: left;
white-space: nowrap;
}

.vertsubitem a	{   /* Font style, size of submenu items */
 font-family: Verdana, Arial, sans-serif;
font-size: 12px;			
text-decoration: none;

position: relative;
display: block;	
}

.vertsubitem a:link, .vertsubitem a:visited	{   /* Default font style & color of submenu items */
color: #000000;
text-decoration: none;	
}

.vertsubitem a:hover	{   /* Font style & color, background submenu color of submenu item when hovered over */
color: #ffffff;
background-color: #21449c;
text-decoration: none;
}

.vertsubitem a:active	{   /* Font style & color, background submenu color of submenu item when clicked */
color: #ffff00;
background-color: #666666;	
text-decoration: none;			
}

.vertsubitem .vertfwdarr, .vertitem .vertfwdarr	{   /* Positioning of right arrow for submenus */
position: absolute;
top: 5px;
right: 8px;
}

.dmselected {   /* Style override for selected category tree */
background-color: #ccc;
	font-weight: bold;
}

.verbar .dmselected {   /* Style override for selected root category */
background-color: #999;
}

/*---------------------------*/
/* Tree and Plain Menu Style */
/*---------------------------*/

.treemenudiv	{	 /* Behaviour of tree/plain menu item - leave as is for proper performance */
display: block;
white-space: nowrap;
}


.phplmbodytable { /* Class of table cells containing plain menus */

}

.phplmnormal {	 /* Font size & color of unlinked menu items */
color: #000000;
font-size: 13px;	
text-decoration: none;	
}


a.phplm:link, a.phplm:visited	{	  /* Font color, style of linked & visited menu items */
color: #003300;
font-size: 13px;	
text-decoration: none;	
}


a.phplm:hover	{	  /* Font color, style of menu items when hovered over */
color: #841212;
background-color: #ccc;
font-size: 13px;	
text-decoration: none;	
}

a.phplm:active	{	  /* Font size & color of menu items when clicked */
color: #ff0000;
font-size: 13px;	
text-decoration: none;	
}

.dmselected {   /* Style overide for selected category tree */
background-color: #ccc;
	font-weight: bold;
}
/* Advanced Searches infobox */
#quick_find select {width:12em; font-size:11px;}
#quick_find select option {width:auto;}

 

<!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>
<link rel="shortcut icon" href="/torrenticon.ico"/>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
<link href="stylesheet.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="includes/tabs/webfxlayout.js"></script>
<link id="luna-tab-style-sheet" type="text/css" rel="stylesheet" href="includes/tabs/tabpanewebfx.css" />
<script type="text/javascript" src="includes/tabs/tabpane.js"></script>
<title>Torrent Audio :: High End Car Audio </title>
<meta name="Description" content="Torrent Audio- High-end car audio components.  Subwoofers, Amps, Installation accessories, power wire, RCA wires, etc."/>
<meta name="Keywords" content="torrent audio, DB-500, TC Sounds, speakers, subwoofers, car audio, subs, mistral, deluge, Bass, sealed boxes, sealed enclosures, competition, amps, mobile audio, spl, sq"/>
</head>
<body style="filter:progid:DXImageTransform.Microsoft.Gradient(endColorstr='#FFFFFF', startColorstr='#373737', gradientType='0');"> 
<div id="container">
 <div id="header">
<a href="/contact_us.php"><img src="/images/price_match.png" alt="Contact Us For Price Match" width="54" height="55" hspace="15" vspace="0" border="0" align="right"/></a>
<p>$breadcrumbs</p>


<ul>
  <li><a href="/">Home</a>	  </li>
  <li><a href="$urlmyaccount">Create Account</a></li>
  <li><a href="$urlmyaccount">Login</a></li>
</ul> 
 </div>
<div id="content">
	<div id="left">
		<div class="menu">
			<div class="menuheader">
			</div>
			<div class="menucontentleft">
				<div>$cartbox </div><br />
			   <div align="left">$manufacturerbox<br />
			  </div>
			   <div align="left">$specialbox</div><br />
			   <div>$reviewsbox</div><br />
			   <div>$orderhistorybox</div><br />
			   <div>$bestsellersbox</div><br />
			   <div>$tellafriendbox</div><br />
			   <div align="left">$informationbox</div><br />
			   <script language="JavaScript" src=	 "https://seal.godaddy.com/getSeal?sealID=639094740032f5ceff12711209d3d4e817c1b085866650" type="text/javascript"></script>
<!-- PayPal Logo --><table border="0" cellpadding="10" cellspacing="0" align="left"><tr><td align="center"></td></tr>
<tr><td align="center"><a href="#" onclick="java script:window.open('https://www.paypal.com/us/cgi-bin/webscr?cmd=xpt/cps/popup/OLCWhatIsPayPal-outside','olcwhatispaypal','toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=yes, resizable=yes, width=400, height=350');"><img  src="https://www.paypal.com/en_US/i/bnr/bnr_shopNowUsing_150x40.gif" border="0" alt="Additional Options" /></a></td>
</tr></table><!-- PayPal Logo -->	
		  </div>

	  </div>
		<div class="menufooter"></div>
  </div>
  <div id="middle">
		<div class="post">
			<div class="postheader">
			</div>
			<div class="postcontent">
			$content<br />
			<br />
			<div align="center"> <a href="http://www.torrentaudio.com/kinetikpowercells-c-36_32.html"><img src="/images/banners/KinetikBanner2.gif" alt="Kinetik Audio" hspace="2" vspace="2" border="0"></a></div>
		  </div>
			<div class="postfooter"></div>
	</div>
  </div>
 </div>
</div>
	<div id="footer">
	<ul>
	<li><a href="/">Home</a>		</li>
	<li><a href="$urlmyaccount">New Account </a></li>
	<li><a href="$urlmyaccount">Login</a></li>
	<li class="last"><a href="/shopping_cart.php">My Cart</a></li>
	</ul>
	<span>Copyright © 2007 Torrent Audio. All rights reserved.</span> 
	</div>
</body>
</html>

Gauravs

Gauravs

Posted
Posted

Your header has image of dimension (header.png) 851px × 86px

 

While tables throughout the code have relative width of screen size (browser size) in %, images do not resize and thus the problem. Small header images / logo can help you.

 

Thx

GS

Best Regards,
Gaurav

torrent

torrent

Posted
  • Author
Posted
Your header has image of dimension (header.png) 851px × 86px

 

While tables throughout the code have relative width of screen size (browser size) in %, images do not resize and thus the problem. Small header images / logo can help you.

 

I would like the content of the site to stay the same size whether the window is maximized or not though. I have the dimensions specified in my stylesheet as pixels not as percentages and i changed the tables from 100% to 994px and that didnt fix it either...

Archived

This topic is now archived and is closed to further replies.

Go to topic listing
×
×
  • Create New...