Forums / Templates, Stylesheets, Page Layout / How to move the sidebox side ways. from left to more left? realy need help...

How to move the sidebox side ways. from left to more left? realy need help...

Locked

Views: 2,793

Results 1 to 9 of 9
This thread is locked. New replies are disabled.
26 Aug 2007, 8:42 PM
#1
brekke00 avatar

brekke00

New Zenner

Join Date:
Aug 2007
Posts:
57
Plugin Contributions:
0

How to move the sidebox side ways. from left to more left? realy need help...

please help me.. how can i move the sidebox sideways? not rom the left side to the right side.
they are not in the outer border of my site as i wish them to be.

they are curantly standing like the B below...

--------------------
B B
B B
B B
--------------------

When i want them to stand like the B below...

--------------------
B B
B B
B B
--------------------

Does any of you good people have a solution for my problem?

Please deskribe as accurat as posible to me... i know my way around but css is relativly new for me.

Thanks For all Help i can get

26 Aug 2007, 8:56 PM
#2
brekke00 avatar

brekke00

New Zenner

Join Date:
Aug 2007
Posts:
57
Plugin Contributions:
0

Re: How to move the sidebox side ways. from left to more left? realy need help...

please help me.. how can i move the sidebox sideways? not rom the left side to the right side.
they are not in the outer border of my site as i wish them to be.

they are curantly standing like the A below... When i want them to stand like the B below...

|--------------------| *** |--------------------|
|--------------------| *** |--------------------|
|.... B.........B.......| *** |B.....................B|
|.....B.........B.......| *** |B.....................B|
|.....B.........B.......| *** |B.....................B|
|.........................| *** |.........................|
|.........................| *** |.........................|
|--------------------| *** |--------------------|

Does any of you good people have a solution for my problem?

Please deskribe as accurat as posible to me... i know my way around but css is relativly new for me.

Thanks For all Help i can get

Sorry for dobble post.

27 Aug 2007, 4:13 AM
#3
awhfy99 avatar

awhfy99

Zen Follower

Join Date:
Feb 2007
Location:
Burleson. Texas
Posts:
196
Plugin Contributions:
0

Re: How to move the sidebox side ways. from left to more left? realy need help...

What I did was to edit my css in includes/templates/MY TEMPLATE. There was some fixed numbers that I assigned a percent to. It has been so long that I am not sure which one did the trick, but I will paste my whole css here and you can probably figure it out.

/**
* Main CSS Stylesheet
*
* @package templateSystem
* @copyright Copyright 2003-2006 Zen Cart Development Team
* @copyright Portions Copyright 2003 osCommerce
* @license [URL]http://www.zen-cart.com/license/2_0.txt[/URL] GNU Public License V2.0
* @version $Id: stylesheet.css 5349 2006-12-22 20:34:40Z birdbrain $
*/
body {
margin: 0;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 62.5%;
color: #000000;
background-color: #eedecc;
}
a img {border: none; }
a:link, #navEZPagesTOC ul li a {
color: #3300FF;
text-decoration: none;
}

a:visited {
color: #3300FF;
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: #FF0000;
}
a:active {
color: #0000FF;
}
h1 {
font-size: 1.5em;
color: #9a9a9a;
}
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-family: arial, verdana, helvetica, sans-serif;
font-size: 1em;
}
FORM, SELECT, INPUT {
display: inline;
font-size: 1em;
margin: 0.1em;
}
TEXTAREA {
float: left;
margin: auto;
display: block;
width: 95%;
}
input:focus, select:focus, textarea:focus {
background: #E4FEF5;
}
FIELDSET {
padding: 0.5em;
margin: 0.5em 0em;
border: 1px solid #cccccc;
}
LEGEND {
font-weight: bold;
padding: 0.3em;
}
LABEL, h4.optionName {
line-height: 1.5em;
padding: 0.2em;
}
LABEL.checkboxLabel, LABEL.radioButtonLabel {
margin: 0.5em 0.3em;
}
.centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .centerBoxContentsAlsoPurch, .attribImg {
float: left;
} 
#logo {text-align:center;}


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: #ff0000;
color: #ffffff;
}
.messageStackSuccess {
background-color: #99FF99;
color: #000000;
}
.messageStackCaution {
background-color: #FFFF66;
color: #000000;
}
/*wrappers - page or section containers*/
#mainWrapper {
background-color: #eedecc;
text-align: left;
width: 100%;
vertical-align: top;
border: 1px solid #9a9a9a;
}
#headerWrapper, #contentMainWrapper, #logoWrapper, #cartBoxListWrapper, #ezPageBoxList, #cartBoxListWrapper ul, #ezPageBoxList ul, #mainWrapper, #popupAdditionalImage, #popupImage {
margin: 0em;
padding: 0em;
}
#logoWrapper{
background-image: url(../images/logo_.gif);
background-color: #eedecc;
height:102px;

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

#tagline {
color:#000000;
font-size: 2em;
text-align : center;
vertical-align: middle;
}
#sendSpendWrapper {
border: 1px solid #cacaca;
float: right;
margin: 0em 0em 1em 1em;
}
.floatingBox, #accountLinksWrapper, #sendSpendWrapper, #checkoutShipto, #checkoutBillto, #navEZPagesTOCWrapper {
margin: 0;
width: 47%;
}
.wrapperAttribsOptions {
margin: 0.3em 0em;
}
/*navigation*/
.navSplitPagesResult {}
.navSplitPagesLinks {}
.navNextPrevCounter {
margin: 0em;
font-size: 0.9em;
}
.navNextPrevList {
display: inline;
white-space: nowrap;
margin: 0;
padding: 0.5em 0em;
list-style-type: none;
}
#navMainWrapper, #navSuppWrapper, #navCatTabsWrapper {
margin: 0em;
background-color: #0000ff;
background-image: url(../images/tile_back.gif);
padding: 0.5em 0.2em;
font-weight: bold;
color: #0000ff;
height: 1%;
}
#navCatTabsWrapper {
background-color: #eedecc;
color: #9a9a9a;
background-image:none;
}
#navMain ul, #navSupp ul, #navCatTabs ul {
margin: 0;
padding: 0.5em 0em;
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, #navSupp ul li a, #navCatTabs ul li a {
text-decoration: none;
padding: 0em 0.5em;
margin: 0;
color: #0000fe;
white-space: nowrap;
}
#navCatTabs ul li a {
color: #0000ff;
}
#navEZPagesTOCWrapper {
font-weight: bold;
float: right;
height: 1%;
border: 1px solid #9a9a9a;
}
#navEZPagesTOC ul {
margin: 0;
padding: 0.5em 0em;
list-style-type: none;
line-height: 1.5em;
}
#navEZPagesTOC ul li {
white-space: nowrap;
}
#navEZPagesTOC ul li a {
padding: 0em 0.5em;
margin: 0;
}
#navCategoryIcon, .buttonRow, #indexProductListCatDescription {
margin: 0.5em;
}
#navMainSearch {
float: right;
}
#navBreadCrumb {
padding: 0.5em 0.5em;
background-color: #eedecc;
font-size: 0.95em;
font-weight: bold;
margin: 0em;
}
#navEZPagesTop {
background-color: #eedecc;
background-image: url(../images/tile_back.gif);
font-size: 0.95em;
font-weight: bold;
margin: 0em;
padding: 0.5em;
}
#navColumnOne, #navColumnTwo {
background-color: transparent;
}
/*The main content classes*/
#contentColumnMain, #navColumnOne, #navColumnTwo, .centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .additionalImages, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatured, .centerBoxContentsNew, .alert {
vertical-align: top;
}
/*.content,*/ #productDescription, .shippingEstimatorWrapper {
/*font-size: 1.2em;*/
padding: 0.5em;
}
.alert {
color: #FF0000;
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 #000000;
padding: 1em;
}
.tableHeading TH {
border-bottom: 1px solid #9a9a9a;
}
.tableHeading, #cartSubTotal {
background-color: #e9e9e9;
}
#cartSubTotal {
border-top: 1px solid #cccccc;
font-weight: bold;
text-align: right;
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 0em;
}
.cartUnitDisplay, .cartTotalDisplay {
text-align: right;
padding-right: 0.2em;
}
#scUpdateQuantity {
width: 2em;
}
.cartQuantity {
width: 4.7em;
}
.cartNewItem {
color: #33CC33;
position: relative; /*do not remove-fixes stupid IEbug*/
}
.cartOldItem {
color: #660099;
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;
}
.normalprice, .productSpecialPriceSale {
text-decoration: line-through;
}
.productSpecialPrice, .productSalePrice, .productSpecialPriceSale, .productPriceDiscount {
color: #ff0000;
}
.orderHistList {
margin: 1em;
padding: 0.2em 0em;
list-style-type: none;
} 
#cartBoxListWrapper ul, #ezPageBoxList ul {
list-style-type: none;
}
#cartBoxListWrapper li, #ezPageBoxList li, .cartBoxTotal {
margin: 0;
padding: 0.2em 0em;
} 
#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: 0em 1em 1em 0em ;
}
.categoryIcon {}
#cartImage {
margin: 0.5em 1em;
}
/*Attributes*/
.attribImg {
width: 20%;
margin: 0.3em 0em;
}
.attributesComments {}
/*list box contents*/
.centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .additionalImages, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatured, .centerBoxContentsNew {
margin: 1em 0em;
}
.centerBoxWrapper {
border: 1px solid #9a9a9a;
height: 1%;
margin: 1.1em 0;
}
h2.centerBoxHeading {
font-size: 1.3em;
color: #000000;
}
/*sideboxes*/
.columnLeft {}
h3.leftBoxHeading, h3.leftBoxHeading a,
h3.rightBoxHeading, h3.rightBoxHeading a {
font-size: 1em;
color: #000000;
}
#manufacturersHeading, #currenciesHeading, #musicgenresHeading, #recordcompaniesHeading, #searchHeading, #search-headerHeading {
font-size: 0.9em;
color: #000000;
}
.leftBoxHeading, .centerBoxHeading, .rightBoxHeading {
margin: 0em;
background-color: #eedecc;
background-image: url(../images/tile_back.gif);
padding: 0.5em 0.2em;
}
.leftBoxContainer, .rightBoxContainer {
margin: 0em;
border: 1px solid #9a9a9a;
border-bottom: 5px solid #336633;
margin-top: 1.5em;
}
.sideBoxContent {
background-color: #eedecc;
padding: 0.4em;
}
h3.leftBoxHeading a:hover, h3.rightBoxHeading a:hover {
color: #ff3334;
text-decoration: none;
} 
.rightBoxHeading a:visited, .leftBoxHeading a:visited, .centerBoxHeading a:visited {
color: #000000;
}
.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: 0em 0em 0em 1.5em;
}
#bestsellers ol {
padding: 0;
margin-left: 1.1em;
}
#bestsellers li {
padding: 0;
margin: 0.3em 0em 0.3em 0em;
}
#bannerboxHeading {
background-color: #eedecc;
}
#upProductsHeading {
text-align: left;
}
#upDateHeading {
text-align: right;
}
/* categories box parent and child categories */
A.category-top, A.category-top:visited {
color: #000000;
text-decoration: none;
}
A.category-links, A.category-links:visited {
color: #000000;
text-decoration: none;
}
A.category-subs, A.category-products, A.category-subs:visited, A.category-products:visited {
color: #ff3333;
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: #eedecc;
background-image: url(../images/tile_back.gif);
height: 2em;
color: #abbbd3;
}
#siteMapList {
width: 90%;
float: right;
}
.ratingRow {
margin: 1em 0em 1.5em 0em;
}
LABEL#textAreaReviews {
font-weight: normal;
margin: 1em 0em;
}
#popupShippingEstimator, #popupSearchHelp, #popupAdditionalImage, #popupImage, #popupCVVHelp, #popupCouponHelp, #popupAtrribsQuantityPricesHelp, #infoShoppingCart {
background-color: #eedecc;
}

If you copy the code, just edit the colors, font sizes, or whatever else back to where you need it.

Dennis
www.stampdays.com
Over 80,000 stamps and still growing!

27 Aug 2007, 4:39 AM
#4
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: How to move the sidebox side ways. from left to more left? realy need help...

For future reference, don't post whole long files in the forum without wrapping in ```
[code] and [/code]

27 Aug 2007, 4:47 AM
#5
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: How to move the sidebox side ways. from left to more left? realy need help...

Brekke, a link to your site would allow us to see what is causing your problem and advise you how to fix it.

27 Aug 2007, 1:12 PM
#7
brekke00 avatar

brekke00

New Zenner

Join Date:
Aug 2007
Posts:
57
Plugin Contributions:
0

Re: How to move the sidebox side ways. from left to more left? realy need help...

here you can see my broblem.

http://www.brekke-media.com

ty for answering me. but i coud not figur out based on your template.css

i am relativly new to css so i got alott to learn.

and i have read the tutorial so many times and still i cant figur it out.

27 Aug 2007, 1:25 PM
#8
barco57 avatar

barco57

Totally Zenned

Join Date:
Apr 2006
Location:
West Salem, IL
Posts:
2,845
Plugin Contributions:
0

Re: How to move the sidebox side ways. from left to more left? realy need help...

Ok real easy......this template is set at 760px wide as shown by this section of your style sheet:```
#mainWrapper {
background-color: #ffffff;
text-align: left;
width: 760px;
vertical-align: top;
clear:both;
}


change it to read:```
#mainWrapper {
	background-color: #ffffff;
	text-align: left;
	width: 100%;
	vertical-align: top;
	clear:both;
	}

Mike
AEIIA - Zen Cart Certified & PCI Compliant Hosting
The Zen Cart Forum...Better than a monitor covered with post-it notes!

27 Aug 2007, 1:38 PM
#9
brekke00 avatar

brekke00

New Zenner

Join Date:
Aug 2007
Posts:
57
Plugin Contributions:
0

Re: How to move the sidebox side ways. from left to more left? realy need help...

Thank you so!!!!!!!!!!

I am You just saved my day...

:oops:i was looking for sidebox inn the css file. that is why i did not find it.

Thank You!!!
:clap: