Trying to align right w/ no luck

Hi, I'm trying to get my home page laid out like I want it and so far this morning I've been able to figure out how to get my rotating gif to align right but for the life of me I'm not sure what's constraining my home page text from using up all the space that is there. I don't understand why it won't continue to the right and use all that empty space? Please help if you can.

Ian

A URL would help so we can see the problem :smile:

Dad gummit. If I forget that url one more time I swear I'll just quit.

mowerpartsupply.com/catalog

Check your stylesheet parameters for the entry

id="welcomeText"

This seems to be where the problem is.

This was the only "welcome text" I found in my stylesheet. I don't see any problem???

Ian

#welcomeText {width: 260px; float: left; font-size: 1.2em;}

#welcomeText p {margin: 0; padding: 0;}

In your stylesheet:

#welcomeText {width: 260px; float: left; font-size: 1.2em;}

You'll need to increase the width.

(And, no offense, I like the look of your site, but that image is really annoying. Can you slow down the change rate considerably?)

#welcomeText {stylesheet.css (line 653)
float:left;
font-size:1.2em;
width:260px;
}

The width:260px; is limiting the text flow, just increase the value or remove it altogether :smile:

Hey Stevesh and PGlad, I've got one other issue that would be great to solve if you don't mind helping a little more. I'm having problems with IE6 in that it's displaying just as shown in the photo link below. I can't seem to figure out why in the world it's only doing this in IE6?

Ian
https://www.mowerpartsupply.com/images/IE-error.jpg

Can you show me what you have in your stylesheet for #logoWrapper ?

/** * Main CSS Stylesheet * * @package templateSystem * @copyright Copyright 2003-2007 Zen Cart Development Team * @copyright Portions Copyright 2003 osCommerce * @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0 * @version $Id:stylesheet.css 5952 2007-03-03 0:18:46Z drbyte $ */
body
{ margin:0;
font:72.5% verdana,arial,helvetica,sans-serif;
color:#000;
background-color:#D1E6FB; }

a img
{ border:none; }

a:link,#navEZPagesTOC ul li a
{ color:#336633; /* this color code controls the color of the links in the header, it also controls all the smaller links throughout all the pages included in the cart */
text-decoration:none; }

a:visited
{ color:#336633;
text-decoration:none; }

a:hover,#navEZPagesTOC ul li a:hover,#navMain ul li a:hover,#navSupp ul li a:hover,#navCatTabs ul li a:hover
{ color:#000; }

a:active
{ color:#FFF; }

#information a, #categories a , #categories
{color: #008000;
margin-top: 0;}

a:hover,#information a:hover,#categories a:hover
{ color:#000000;}

#information {margin-top: 0;} /* this margin sets the information box so that it's right below the categories box */

h1
{ font-size:1.5em;
color:#008000; } /* this color code controls the color of the top left category identifier when you click on a product category */

h2
{ font-size:1.4em; }

h3
{ font-size:1.3em; }

h4,h5,h6,LABEL,h4.optionName,LEGEND,ADDRESS,.sideBoxContent,.larger
{ font-size:1.1em; }

.biggerText
{ font-size:1.2em; }

h1,h2,h3,h4,h5,h6
{ margin:0.3em 0; }

/* Might uncomment either or both of these if having problems with IE peekaboo bug:h1,h2,h3,h4,h5,h6,p
{ position:relative; }

*html .centerColumn
{ height:1%; }

*/
CODE
{ font:1em arial,verdana,helvetica,sans-serif; }

FORM,SELECT,INPUT
{ display:inline;
font-size:1em;
margin:0.1em; }

TEXTAREA
{ margin:auto;
display:block;
width:95%; }

input:focus,select:focus,textarea:focus
{ background:#E4FEF5; }

FIELDSET
{ padding:0.5em;
margin:0.5em 0;
border:1px solid #ccc; }

LEGEND
{ font-weight:bold;
padding:0.3em;
color:black; }

LABEL,h4.optionName
{ line-height:1.5em;
padding:0.2em; }

LABEL.checkboxLabel,LABEL.radioButtonLabel
{ margin:0.5em 0.3em; }

#logo,.centerBoxContents,.specialsListBoxContents,.categoryListBoxContents,.centerBoxContentsAlsoPurch,.attribImg
{ float:left; }

LABEL.inputLabel
{ width:9em;
float:left; }

LABEL.inputLabelPayment
{ width:14em;
float:left;
padding-left:2.5em; }

LABEL.selectLabel,LABEL.switchedLabel,LABEL.uploadsLabel
{ width:11em;
float:left; }

#checkoutPayment LABEL.radioButtonLabel
{ font-weight:bold; }

P,ADDRESS
{ padding:0.5em; }

ADDRESS
{ font-style:normal; }

.clearBoth
{ clear:both; }

HR
{ height:1px;
margin-top:0.5em;
border:none;
border-bottom:1px solid #9a9a9a; }

/warnings,errors,messages/
.messageStackWarning,.messageStackError,.messageStackSuccess,.messageStackCaution
{ line-height:1.8em;
padding:0.2em;
border:1px solid #9a9a9a; }

.messageStackWarning,.messageStackError
{ background-color:#f00;
color:#fff; }

.messageStackSuccess
{ background-color:#9F9;
color:#000; }

.messageStackCaution
{ background-color:#FF6;
color:#000; }

/wrappers - page or section containers/
#mainWrapper
{ background-color:#fff;
text-align:left;
width:900px;
vertical-align:top;
border:1px solid #9a9a9a; }

#headerWrapper
{ background-image:url(../images/head_bg_2.gif);
background-repeat:repeat;
background-position:center 29px; /* changing the margin below and left padding moves the categories upward underneath the logo */
height:179px; }

#categories {margin-top: 0;}

#navColumnOneWrapper {padding-left: 9px;}

#logoWrapper
{ width:200px;
height:150px;
float:left;
clear:both; }

#navColumnOneWrapper,#navColumnTwoWrapper,#mainWrapper
{ margin:auto; }

#navColumnOneWrapper,#navColumnTwoWrapper
{ margin-left:0.5em;
margin-right:0.5em; }

#tagline
{ color:#000;
font-size:2em;
text-align:center;
vertical-align:middle; }

#sendSpendWrapper
{ border:1px solid #cacaca;
float:right;
margin:0 0 1em 1em; }

.floatingBox,#accountLinksWrapper,#sendSpendWrapper,#checkoutShipto,#checkoutBillto,#navEZPagesTOCWrapper
{ margin:0;
width:47%; }

.wrapperAttribsOptions
{ margin:0.3em 0; }

/navigation/
.navSplitPagesResult
{ ; }

.navSplitPagesLinks
{ ; }

.navNextPrevCounter
{ margin:0;
font-size:0.9em; }

.navNextPrevList
{ display:inline;
white-space:nowrap;
margin:0;
padding:0.5em 0;
list-style-type:none; }

#navSuppWrapper,#navCatTabsWrapper
{ margin:0;
background-color:#abbbd3;
background-image:url(../images/tile_back.gif);
padding:0.5em 0.2em;
font-weight:bold;
color:#000000; /* This color code changes the color of the :: colons in the footer */
height:1%; }

#navMainWrapper
{ /separate this selector to its own rule 12-24/
background:#D1E6FB;
padding:0 0.2em;
font-weight:bold;
height:29px; }

#navCatTabsWrapper
{ background-color:#fff;
color:#9a9a9a;
background-image:none; }

#navMain ul,#navSupp ul,#navCatTabs ul
{ margin:0;
padding:0.5em 0;
list-style-type:none;
text-align:center;
line-height:1.5em; }

#navMain ul li,#navSupp ul li,#navCatTabs ul li
{ display:inline; }

#navMain ul li a
{ text-decoration:none;
padding:0 0.5em;
margin:0;
color:#0a0; /* changed 12-24 */
white-space:nowrap; }

#navSupp ul li a
{ text-decoration:none;
padding:0 0.5em;
margin:0;
color:#f7c808; /* This color code changes the color of the ez pages links in the footer */
white-space:nowrap; }

#navCatTabs ul li a
{ text-decoration:none;
padding:0 0.5em;
margin:0;
color:#000; /* changed 12-24 */
white-space:nowrap; }

#navCatTabs ul li a
{ color:#9a9a9a; }

#navEZPagesTOCWrapper
{ font-weight:bold;
float:right;
height:1%;
border:1px solid #9a9a9a; }

#navEZPagesTOC ul
{ margin:0;
padding:0.5em 0;
list-style-type:none;
line-height:1.5em; }

#navEZPagesTOC ul li
{ white-space:nowrap; }

#navEZPagesTOC ul li a
{ padding:0 0.5em;
margin:0; }

#navCategoryIcon,.buttonRow,#indexProductListCatDescription
{ margin:0.5em; }

#navMainSearch
{ float:right; }

#navBreadCrumb
{ padding:0.5em 0.5em;
background-color:#fff;
font-size:0.95em;
font-weight:bold;
margin:0; }

#navEZPagesTop
{ width:612px; /* This #px specifies how many px from the far right that the ez pages links will begin, originally at 512px */
float:right;
background:none;
font-size:0.95em;
font-weight:bold;
margin:111px 0 0 0; /The first #px term defines how far down from the top of the header that the links will be displayed/
padding:0.5em;
color:#000000; } /This color color code is responsible for the colons in the ez pages header links/

#navEZPagesTop a
{ color:#f7c808; } /This color color code is responsible for the links in the ez pages header/

#navEZPagesTop a:hover
{ color:#000; } /This bit of code makes the header ez pages links hover to the color code specified/

#navColumnOne,#navColumnTwo
{ background-color:transparent; }

/The main content classes/
#contentColumnMain,#navColumnOne,#navColumnTwo,.centerBoxContents,.specialsListBoxContents,.categoryListBoxContents,.additionalImages,.centerBoxContentsSpecials,.centerBoxContentsAlsoPurch,.centerBoxContentsFeatured,.centerBoxContentsNew,.alert
{ color:#000; /* adding this line of color entry made different changes to text colors between IE and FF */
vertical-align:top; }

/.content,/
#productDescription,.shippingEstimatorWrapper
{ /*font-size:1.2em;
*/
padding:0.5em; }

.alert
{ color:#F00;
margin-left:0.5em; }

.advisory
{ ; }

.important
{ font-weight:bold; }

.notice
{ ; }

.rating
{ ; }

.gvBal
{ float:right; }

.centerColumn,#bannerOne,#bannerTwo,#bannerThree,#bannerFour,#bannerFive,#bannerSix
{ padding:0.8em; }

.smallText,#siteinfoLegal,#siteinfoCredits,#siteinfoStatus,#siteinfoIP
{ font-size:0.9em; }

/Shopping Cart Display/
#cartAdd
{ float:right;
text-align:center;
margin:1em;
border:1px solid #000;
padding:1em; }

.tableHeading TH
{ border-bottom:1px solid #9a9a9a; }

.tableHeading,#cartSubTotal
{ background-color:#e9e9e9; }

#cartSubTotal
{ border-top:1px solid #ccc;
text-align:right;
font-weight:bold;
line-height:2.2em;
padding-right:2.5em; }

.tableRow,.tableHeading,#cartSubTotal
{ height:2.2em; }

.cartProductDisplay,.cartUnitDisplay,.cartTotalDisplay,.cartRemoveItemDisplay,.cartQuantityUpdate,.cartQuantity,#cartInstructionsDisplay,.cartTotalsDisplay
{ padding:0.5em 0; }

.cartUnitDisplay,.cartTotalDisplay
{ text-align:right;
padding-right:0.2em; }

#scUpdateQuantity
{ width:2em; }

.cartQuantity
{ width:4.7em; }

.cartNewItem
{ color:#3C3;
position:relative; /* do not remove-fixes stupid IEbug */
; }

.cartOldItem
{ color:#609;
position:relative; /* do not remove-fixes stupid IEbug */
; }

.cartBoxTotal
{ text-align:right;
font-weight:bold; }

.cartRemoveItemDisplay
{ width:3.5em; }

.cartAttribsList
{ margin-left:1em; }

#mediaManager
{ width:50%;
margin:0.2em;
padding:0.5em;
background-color:#E4FEf5;
border:1px solid #003D00; }

.mediaTitle
{ float:left; }

.mediaTypeLink
{ float:right; }

.normalprice,.productSpecialPriceSale
{ text-decoration:line-through;}
.productSpecialPrice,.productSalePrice,.productSpecialPriceSale,.productPriceDiscount
{ color:#f00; }

.orderHistList
{ margin:1em;
padding:0.2em 0;
list-style-type:none; }

#cartBoxListWrapper ul,#ezPageBoxList ul
{ list-style-type:none; }

#cartBoxListWrapper li,#ezPageBoxList li,.cartBoxTotal
{ margin:0;
padding:0.2em 0; }

#cartBoxEmpty,#cartBoxVoucherBalance
{ font-weight:bold; }

.totalBox
{ width:5.5em;
text-align:right;
padding:0.2em; }

.lineTitle,.amount
{ text-align:right;
padding:0.2em; }

.amount
{ width:5.5em; }

/Image Display/
#productMainImage,#reviewsInfoDefaultProductImage,#productReviewsDefaultProductImage,#reviewWriteMainImage
{ margin:0 1em 1em 0; }

.categoryIcon
{ ; }

#cartImage
{ margin:0.5em 1em; }

/Attributes/
.attribImg
{ width:20%;
margin:0.3em 0; }

.attributesComments
{ ; }

/list box contents/
.centerBoxContents,.specialsListBoxContents,.categoryListBoxContents,.additionalImages,.centerBoxContentsSpecials,.centerBoxContentsAlsoPurch,.centerBoxContentsFeatured,.centerBoxContentsNew
{ margin:1em 0; }

.centerBoxWrapper
{ border:1px solid #9a9a9a;
height:1%;
margin:1.1em 0; }

h2.centerBoxHeading
{ font-size:1.3em;
color:#fff; }

/sideboxes/
.columnLeft
{ ; }

h3.leftBoxHeading,h3.leftBoxHeading a,h3.rightBoxHeading,h3.rightBoxHeading a
{ font-size:1em;
color:#fff; }

#manufacturersHeading,#currenciesHeading,#musicgenresHeading,#recordcompaniesHeading,#searchHeading,#search-headerHeading
{ font-size:0.9em;
color:#fff; }

.leftBoxHeading,.centerBoxHeading,.rightBoxHeading
{ margin:0;
background-color:#abbbd3;
background-image:url(../images/tile_back.gif);
padding:0.5em 0.2em; }

.leftBoxContainer,.rightBoxContainer
{ margin:0;
border:1px solid #9a9a9a;
border-bottom:5px solid #363;
margin-top:1.5em; }

.sideBoxContent
{ background-color:#fff;
padding:0.4em; }

h3.leftBoxHeading a:hover,h3.rightBoxHeading a:hover
{ color:#FF3;
text-decoration:none; }

.rightBoxHeading a:visited,.leftBoxHeading a:visited,.centerBoxHeading a:visited
{ color:#FFF; }

.centeredContent,TH,#cartEmptyText,#cartBoxGVButton,#cartBoxEmpty,#cartBoxVoucherBalance,#navCatTabsWrapper,#navEZPageNextPrev,#bannerOne,#bannerTwo,#bannerThree,#bannerFour,#bannerFive,#bannerSix,#siteinfoLegal,#siteinfoCredits,#siteinfoStatus,#siteinfoIP,.center,.cartRemoveItemDisplay,.cartQuantityUpdate,.cartQuantity,.cartTotalsDisplay,#cartBoxGVBalance,.leftBoxHeading,.centerBoxHeading,.rightBoxHeading,.productListing-data,.accountQuantityDisplay,.ratingRow,LABEL#textAreaReviews,#productMainImage,#reviewsInfoDefaultProductImage,#productReviewsDefaultProductImage,#reviewWriteMainImage,.centerBoxContents,.specialsListBoxContents,.categoryListBoxContents,.additionalImages,.centerBoxContentsSpecials,.centerBoxContentsAlsoPurch,.centerBoxContentsFeatured,.centerBoxContentsNew,.gvBal,.attribImg
{ text-align:center; }

#bestsellers .wrapper
{ margin:0 0 0 1.5em; }

#bestsellers ol
{ padding:0;
margin-left:1.1em; }

#bestsellers li
{ padding:0;
margin:0.3em 0 0.3em 0; }

#bannerboxHeading
{ background-color:#00C; }

#upProductsHeading
{ text-align:left; }

#upDateHeading
{ text-align:right; }

/* categories box parent and child categories */
A.category-top,A.category-top:visited
{ color:#008000;
text-decoration:none; }

A.category-links,A.category-links:visited
{ color:#004080;
text-decoration:none; }

A.category-subs,A.category-products,A.category-subs:visited,A.category-products:visited
{ color:#F00;
text-decoration:none; }

SPAN.category-subs-parent
{ font-weight:bold; }

SPAN.category-subs-selected
{ font-weight:bold; }

/* end categories box links */
/misc/
.back
{ float:left; }

.forward,#shoppingCartDefault #PPECbutton
{ float:right; }

.bold
{ font-weight:bold; }

.rowOdd
{ background-color:#E8E8E8;
height:1.5em;
vertical-align:top; }

.rowEven
{ background-color:#F0F0F0;
height:1.5em;
vertical-align:top; }

.hiddenField
{ display:none; }

.visibleField
{ display:inline; }

CAPTION
{ /*display:none;
*/
; }

#myAccountGen li,#myAccountNotify li
{ margin:0; }

.accountTotalDisplay,.accountTaxDisplay
{ width:20%;
text-align:right; /* vertical-align:top */
; }

.accountQuantityDisplay
{ width:10%;
vertical-align:top; }

TR.tableHeading
{ background-color:#cacaca;
height:2em; }

.productListing-rowheading
{ background-color:#abbbd3;
background-image:url(../images/tile_back.gif);
height:2em;
color:#FFF; }

#siteMapList
{ width:90%;
float:right; }

.ratingRow
{ margin:1em 0 1.5em 0; }

LABEL#textAreaReviews
{ font-weight:normal;
margin:1em 0; }

#popupShippingEstimator,#popupSearchHelp,#popupAdditionalImage,#popupImage,#popupCVVHelp,#popupCouponHelp,#popupAtrribsQuantityPricesHelp,#infoShoppingCart
{ background-color:#fff; }

.information
{ padding:10px 3px;
line-height:150%; }

#shoppingcartBody #shippingEstimatorContent
{ clear:both; }

.seDisplayedAddressLabel
{ background-color:#85C285;
text-align:center; }

.seDisplayedAddressInfo
{ text-transform:uppercase;
text-align:center;
font-weight:bold; }

#seShipTo
{ padding:0.2em; }

h1#indexDefaultHeading {display: none;}

#welcomeText {width: 400px; float: left; font-size: 1.2em;}
/* this line controls the home page paragraph, the float left is over ridden by the JUSTIFY put into the main_page.php file found in the define pages editor /
/ the width defines how wide the paragraph will be */

#welcomeText p {margin: 0; padding: 0;}

#productImage {float: left;}

#headerWrapper
{ background-image:url(../images/head_bg_2.gif);
background-repeat:repeat;
background-position:center 29px; /* changing the margin below and left padding moves the categories upward underneath the logo */
height:179px; }

Change the: background-repeat:repeat;

To: background-repeat:no-repeat;

This prevents the header from repeating.

MagicMan:

#headerWrapper
{ background-image:url(../images/head_bg_2.gif);
background-repeat:repeat;
background-position:center 29px; /* changing the margin below and left padding moves the categories upward underneath the logo */
height:179px; }

Change the: background-repeat:repeat;

To: background-repeat:no-repeat;

This prevents the header from repeating.

I know. I've done that but it still leaves the space blank and empty when I want to do away with that space altogether.

Ian

This is what my logoWrapper looks like:

#logoWrapper{
background-image:url(../images/my_header.gif);
background-repeat:no-repeat;
background-color: #ffffff;
height:160px;
width:800px;
}

Make sure the height and width is the exact same size as your header file at first. I actually changed the height by 1px less than the actual. This took away some of the white space. It shows different in IE and Firefox.

I forgot where to control the white space. There are plenty of posts on the white space in the forum. I was just working on this last night. I will find it.

I'm not an expert on browser issues and don't have IE6 to check. It's a long shot and something of a guess but try this and see if it works.

Where you have this in your stylesheet:

#logoWrapper
{ width:200px;
height:150px;
float:left;
clear:both; }

Try replacing it with this:

#logoWrapper
{ width:200px;
height:150px;
float:left;
clear:both; }
margin: 0em;
padding: 0em;
background-repeat: no-repeat;

Try this:

http://www.zen-cart.com/forum/showthread.php?t=116844&highlight=white+space+header

Try this for the white space:

#navSuppWrapper,#navCatTabsWrapper
{ margin:0;
background-color:#abbbd3;
background-image:url(../images/tile_back.gif);
padding:0.5em 0.2em;
font-weight:bold;
color:#000000; /* This color code changes the color of the :: colons in the footer */
height:1%; }

Change padding from 0.5 to 0.0em

My style sheet has #navMainWrapper, #navSuppWrapper, #navCatTabsWrapper all combined. Yours splits them. Make sure that the padding is set to 0.0em 0.2em; for all of yours. This should work.

MagicMan:

Try this for the white space:

#navSuppWrapper,#navCatTabsWrapper
{ margin:0;
background-color:#abbbd3;
background-image:url(../images/tile_back.gif);
padding:0.5em 0.2em;
font-weight:bold;
color:#000000; /* This color code changes the color of the :: colons in the footer */
height:1%; }

Change padding from 0.5 to 0.0em

My style sheet has #navMainWrapper, #navSuppWrapper, #navCatTabsWrapper all combined. Yours splits them. Make sure that the padding is set to 0.0em 0.2em; for all of yours. This should work.

Well I changed those paddings too and that also didn't work....

Ian

I have to be honest with you. Your style sheet is one hec of a CSS. Where did you get it?

You are probably better just taking the template_default style sheet and starting over.

Try installing the firebug mod in Firefox. When you right click on a particular part of the page you can select "Inspect Element" and it will give you valuable information as to what part of the code and CSS affects that portion of the site.

Give me the URL to your site and I will look at it for you.

MagicMan:

I have to be honest with you. Your style sheet is one hec of a CSS. Where did you get it?

You are probably better just taking the template_default style sheet and starting over.

Try installing the firebug mod in Firefox. When you right click on a particular part of the page you can select "Inspect Element" and it will give you valuable information as to what part of the code and CSS affects that portion of the site.

Give me the URL to your site and I will look at it for you.

Well, I didn't really get my stylesheet from anywhere. I started off with the default zen cart style sheet and started editing away. My link is below. I really appreciate the help!

Ian
https://www.mowerpartsupply.com/catalog

Ok it looks really nice. You got it cleaned up. What is it that you are trying to do now?

If you are looking to move the phone number and information in your header do it in photoshop or other image editor and the just upload the new header background image and there. It is moved to the right some more.