dont know left from right, really need help.

Hey all,

im a new zenner. Love the app. and cant wait for the new update.

I have a customisation issue. i think it is in my css.

my webpage shows well in ie.
i learned today, not to look at iexplorer untill firefox works.

have worked all day to tweak my site. looked good, untill i open it in firefox.

it still looks ok in firefox, but my account create fields are sooo screwed.

i could really use some help from someone since i am pulling my hair out.

(link is https://www.esseorganicskincare.nl)

My css is as follows:

/**
 * 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 06:18:46Z drbyte $
 */

/**
 * Colour list
 *
 * #000000 - White used for background colour
 * #DDDFD9 - Very light green used for input focus and body background
 * #2E3126 - Dark green used for active/hover links
 * #777777 - Gray used for Headings
 */


/* Dit is de tekst van de hoofdpagina*/

body {
	margin: 0;
	font-family: verdana, arial, helvetica, sans-serif;
	font-size: 80%;  /*12px;*/
	background-color: White;
	overflow: -moz-scrollbars-vertical; /*altijd scrollbars in FF*/
	}

a img {
	border: 1px solid #FFFFFF; 
	}

a:link, #navEZPagesTOC ul li a {
	text-decoration: none;
	color: #666600;
	}
 
a:visited {
	color: #666600 ;
	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: #CCCC33;
	}

a:active {
	color: #CCCC33;
	}

h1 {
	font-family: verdana, helvetica, sans-serif;
	font-size: 1.2em;
	color:#666600;
	}

h2 {
	font-family: verdana, helvetica, sans-serif;
	font-size: 1.0em;
	color:#666600;
	}

h3 {
	font-family: verdana, helvetica, sans-serif;
	font-size: 1.2em;
	color:#666600;
	}

h4, h5, h6, LABEL, h4.optionName, LEGEND, ADDRESS, .sideBoxContent, .larger{
	font-family: verdana, helvetica, sans-serif;
	font-size: 1em;
	float: left;
	color:#666600;
	}

.biggerText {
	font-size: 0.9em;
	}

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: 0.9em;
	}

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

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

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

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

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

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

LABEL.checkboxLabel, LABEL.radioButtonLabel {
	margin: 0.5em 0.3em;
	}
	
.categoryListBoxContents {
	color:#666600;
	font:Verdana, Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-size: 0.9em;
	margin-right:100px;

	
	
	}

/* begin pagina, logo, knoppen boven, categorien en inhoud main, tot #logo*/
.centerBoxContents {
text-align:left;


}

.categoryListBoxContents {
float:left;

}

.specialsListBoxContents,  .centerBoxContentsAlsoPurch, .attribImg {
	float: left;
	}
	
#logo {
width:100%;
float:none;
text-align:left;
}


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

LABEL.inputLabel {
	width: 9em;
	float: left;
	}
/* ideal logo betaalpagina */
LABEL.inputLabelPayment {
	width: 5em;
	float: left;
	padding-left: 0.5em;
	}

LABEL.selectLabel, LABEL.switchedLabel, LABEL.uploadsLabel {
	width: 11em;
	float: right;
	}
/* text bij betaal methode */
#checkoutPayment LABEL.radioButtonLabel {
	font-weight: bold;
	float:left;
	font-size:10px;
	color: #666666;
	}
ADDRESS {
	padding:2em;
	font-style: normal;
	}

.clearBoth {
	clear: both;
	}

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

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

.messageStackWarning, .messageStackError {
	background-color: #FFFFFF;
	color: #000000;
	}

.messageStackSuccess {
	background-color: #FFFFFF;
	color: #000000;
	}

.messageStackCaution {
	background-color: #FFFFFF;
	color: #000000;
	}


/*wrappers - page or section containers*/
#mainWrapper {
	background-color: White;
	text-align: left;
	width: 750px;
	empty-cells:hide;
	vertical-align: top;
	border: 1px solid #FFFFFF;
	color:#666600;
	}

#headerWrapper, #contentMainWrapper, #logoWrapper, #cartBoxListWrapper, #ezPageBoxList, #cartBoxListWrapper ul, #ezPageBoxList ul, #mainWrapper, #popupAdditionalImage, #popupImage {
	margin: 0em;
	padding: 0em;
	}

#logoWrapper{
	height:00px;
	margin-top: 00px;
	}

#logo a img {
	border: 0px solid #FFFFFF; 
	}

#navColumnOneWrapper, #navColumnTwoWrapper, #mainWrapper {
	margin: auto;
	} 
#navColumnOneWrapper, #navColumnTwoWrapper {
	margin-left: 0.5em;
	margin-right: 15.5em;
	}
	
#tagline {
	font-size: 2em;
	text-align : center;
	vertical-align: middle; display: none; /*hide slogan*/
	}

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

 #accountLinksWrapper, #sendSpendWrapper,  #navEZPagesTOCWrapper {
	margin: 0;
	width: 50%;
	text-align: right;
	font-weight:lighter;
	}
	
#checkoutShipto {
text-align:left;
}	

#checkoutBillto {
text-align:left;
}
	
.floatingBox, {

	}
	
	
.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;
	padding: 0.5em 0.2em;
	font-weight: normal;
	height: 1%;
	}
#navMainWrapper{
	width: 800px;
	text-align:right;
	background-color: #FFFFFF;
	padding: 0 0;	/*new totale breedte*/
}
#navCatTabsWrapper {
}

#navMain ul, #navSupp ul, #navCatTabs ul {
	margin: 0;
	padding: 0.5em 0em;
	list-style-type: none;
	text-align: center;
	line-height: 1.0em;
	
	}
#navMain ul{
	margin: 0 0 0 10px; /*new*/
}
#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 0em ;/*0.5em;*/
	margin: 0;
	white-space: nowrap;
	}
#navSupp a{ 
	font-size: 11px; text-transform: uppercase; color: #CCCC33;}
	
#navCatTabs ul li a {
	}

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

#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 {
	color:#666600;
	margin: 0.0em;
	}

#navMainSearch {
	margin: 3px 0px 0px 10px;
	float: left;
	}

#navBreadCrumb {
	color: #CCCC00;
	padding: 0px 0 0 1em;
	font-size: 0.8em;
	font-weight: bold;
	margin-top: 0em;
	margin-bottom: 2em;
	}

#navEZPagesTop {
	font-size: 0.9em;
	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;
	color:666600;
	}

/*.content,*/ #productDescription, .shippingEstimatorWrapper {
	font:Verdana, Arial, Helvetica, sans-serif;
	font-weight:lighter;
	color: #666600;
	font-size: 1em;
	font-style:normal;
	padding: 0.5em;
	}
.listingDescription{
	text-align: left;	/*categorie overzicht product specifiek*/
}
.alert {
	color: #666600;
	margin-left: 0.5em;
	}
.advisory {}
.important {
	font-weight: bold;
	}
.notice {}
.rating{}
.gvBal {
	float: right;
	}
.centerColumn, #bannerOne, #bannerTwo, #bannerThree, #bannerFour, #bannerFive, #bannerSix {
	padding: 0.8em;
	}

.centerColumn {
	padding-top: 2em;
}

.smallText, #siteinfoLegal, #siteinfoCredits, #siteinfoStatus, #siteinfoIP {
	font-size: 0.9em;
	color: #666600;
	}
#siteinfoLegal {
	padding-bottom: 10px;
}
/*Shopping Cart Display*/
#cartAdd {
	float: right;
	text-align: center;
	margin: 1em;
	border: 1px solid #FFFFFF;
	padding: 1em;
	}

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

.tableHeading, #cartSubTotal {
padding:1.5em;
	 }
	 

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

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

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

.cartQuantity {
text-align:right;
}

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

#scUpdateQuantity {
	width: 5.0em;
	}

.cartQuantity {
	width: 5.0em;
	}

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

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

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

.cartRemoveItemDisplay {
	width: 3.5em;
	}

.cartAttribsList {
	margin-left: 1em;
	
	}

.normalprice, .productSpecialPriceSale {
	text-decoration: line-through;
	}

.productSpecialPrice, .productSalePrice, .productSpecialPriceSale, .productPriceDiscount {
	}

.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;
}

#PPECbutton {

}

.attributesComments {}

/*consument en salon categorie*/
.centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .additionalImages, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatured, .centerBoxContentsNew {
	font-weight: ;
	padding-bottom: 0.5em;
	}



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

h2.centerBoxHeading {
	font-size: 1em;
	}

/*sideboxes*/
.columnLeft {}

h3.leftBoxHeading, h3.leftBoxHeading a,
h3.rightBoxHeading, h3.rightBoxHeading a {
	font-size: 0.9em;
	}
#manufacturersHeading, #currenciesHeading, #musicgenresHeading, #recordcompaniesHeading, #searchHeading, #search-headerHeading {
	font-size: 1em;
	text-align:left;
}

.leftBoxHeading, .centerBoxHeading, .rightBoxHeading {
	margin: 0em;
	padding: 0.3em 0.2em;
	}
/* info afstand rechts */
.leftBoxContainer, .rightBoxContainer {
	margin: 0em;
	margin-top: 0.5em;
	text-align:left;
	}
/* rechterbox ruimte tussen tekst*/
.sideBoxContent {

border-style: hidden;
	padding: 1em;
	border-bottom-style: inset;
	text-align: left;
	}

h3.leftBoxHeading a:hover, h3.rightBoxHeading a:hover {
	color: #CCCC33;
	text-decoration: none;
	} 
.rightBoxHeading a:visited, .leftBoxHeading a:visited, .centerBoxHeading a:visited {
	}
h3#whatsnewHeading.leftBoxHeading, h3#whatsnewHeading.rightBoxHeading{
	font-size: 10px; text-transform: none; text-align:left;/*new*/
}
.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: left;
	}

/* koptekst boven winkelwagen sidebox */
h3.leftBoxHeading {
	font-size: 10px;
	font-weight: Bold;
	text-transform: uppercase; 
	letter-spacing: 0.0px;	/*aangepast*/
}
h3#languagesHeading.leftBoxHeading{
	text-transform: none; padding-left: 0.5em;
}
h3#searchHeading.leftBoxHeading{
	font-size: 11px;
}
#subscribeHeading.leftBoxHeading {
	font-size: 11px;
	text-align: center; 
	text-transform: uppercase; font-weight: normal;	/*aangepast*/
	}
#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 {
}

#upProductsHeading {
	text-align: left;
	}

#upDateHeading {
	text-align: right;
	}

/* categories box parent and child categories */
A.category-top, A.category-top:visited {
	text-decoration: none;
	font-size: 11px;
	line-height: 1.5em;
	text-transform: uppercase;
	font-weight:lighter;
	color: #CCCC00;
	
	/*border-bottom: 2px solid white;*/
	}


A.category-links, A.category-links:visited {
	text-decoration: none;
	font-size:9px;
	}
A.category-subs, A.category-products, A.category-subs:visited, A.category-products:visited {
	text-decoration: none;
	line-height: 1.5em;
	}
SPAN.category-subs-parent {
	font-weight: lighter;
	}
SPAN.category-subs-selected {
	font-weight: lighter;
	}
/* end categories box links */





/*misc*/
.back {
	float: left;
	}

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

.bold {
	font-weight: bold;
	}

.rowOdd {
	/* @change vicus jho 20081209 */
	/* background-color: #E8E8E8; */
	height: 1.5em;
	vertical-align: top;
	}

.rowEven {
	/* @change vicus jho 20081209 */
	/* background-color: #F0F0F0; */
	height: 1.5em;
	vertical-align: top;
	}

.hiddenField {
	display: none;
}
.visibleField {
	display: inline;
	
}

CAPTION {
	/*display: none;*/
	}

#myAccountGen li, #myAccountNotify li {
	margin: 0;
	text-align:left;
	} 

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

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

TR.tableHeading {
	height: 2em;
	}

h1#productListHeading {display: none;}


.productListing-rowheading {
	height: 2em;
	color:#FFFFFF; /*kleur aangepast*/
	}

#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 {
	color: #666600;
	}
	
.information {padding: 10px 3px; line-height: 100%;}

#shoppingcartBody #shippingEstimatorContent {
	clear: both;
	}

.seDisplayedAddressLabel {
	text-align: center;
	}
.seDisplayedAddressInfo {
	text-transform: uppercase;
	text-align: center;
	font-weight: bold;
	font-size:10px;
	}
#seShipTo {
	padding: 0.2em;
	}

as you probably can tell, i am adjusting, looking, undo, adjust, look, undo, untill it is right. This takes hoursssss and i figured there are people way smarter then me in this.

Pls help.

Alex

Looked ok when I opened in FF and selected your sign in page

Try adding this to your stylesheet:

#login-email-address {float:left;}

kobra:

Looked ok when I opened in FF and selected your sign in page

Tnx for taking the time to respond. apreciate it.

The problem is in the account create part. :blush:

floats right. still havent solved it. working all day on it.

:frusty::frusty::frusty::frusty::frusty:

How about adding float:left; to FIELDSET in the stylesheet?

I am having a language issue but think I know what you are referencing???

Find this file tpl_login_default.php and if not in your template at includes/templates/esse-beauty/templates then make a copy of it from includes/templates/template_default/templates/

Open it in a plaintext editor and find these 2 pieces of code

<div class="buttonRow forward"><?php echo zen_image_submit(BUTTON_IMAGE_CREATE_ACCOUNT, BUTTON_CREATE_ACCOUNT_ALT); ?></div>

<div class="buttonRow forward"><?php echo zen_image_submit(BUTTON_IMAGE_LOGIN, BUTTON_LOGIN_ALT); ?></div>

Change to the highlighted code

<div class="buttonRow back"><?php echo zen_image_submit(BUTTON_IMAGE_CREATE_ACCOUNT, BUTTON_CREATE_ACCOUNT_ALT); ?></div>

<div class="buttonRow back"><?php echo zen_image_submit(BUTTON_IMAGE_LOGIN, BUTTON_LOGIN_ALT); ?></div>

Save and upload to your includes/templates/esse-beauty/templates/ folder
If this is not what you were referencing then just delete this file

stevesh:

How about adding float:left; to FIELDSET in the stylesheet?

THAT WORKED!!!

DUDE THANX!!!

Could you also be so nice to checkout my payment page.
when i select the bottom payment option, the whole nextpage goes weird after i click on checkout.

the store info is displayed through the headers etc.

that would be the final piece of this project!

tnx in advance for taking the time.
really appreciate it.

Alex:clap::clap::clap::clap::clap:

can you make a test account and give the username and pass.

is hard to figure the fields name.

username [email protected]
password test1

will make it now.

2 minutes

Any luck??
:frusty::frusty::frusty::frusty:

not from my end , this problem is too complicated for me . would love to know how this will be fixed ..

That bad huh!

Could it be a styleshit error? or faulty input there?

Dont understand. Going to override all my templates and build from there.

tnx anyway. will keep u posted.

Any wizzard up for the challenge?
Really need your help.
Nice bonus in it if someone fixes it.
:clap::clap::frusty::frusty::frusty::frusty:

Alex

I guess I'm not sure what the issue is. When I get to the payment page and select the bottom radio button (it's surprisingly hard to navigate on a page that is in a language you don't speak :P) the next page looks OK to me, in IE7 anyway.

In firefox and ie6 it sux.

layout is split in 2. left and right side and text goes through text.

sigh. aint there a template page i can steal?

tnx again bud

Alex
:oops::frusty::frusty::frusty:

Anybody?

pls!?

help?

:clap::flex::flex::lamo::lamo::frusty::frusty:

Nevermind. was wrong .

:clap::clap:Tnx man!

going to try.

Where do i change this last code in? what page?

peace and tnx a million. If it works, ill send you a gift.

Alex
:clap:

h4, h5, h6, label, h4.optionName, legend, address, .sideBoxContent, .larger {stylesheet.css (line 71)
color:#666600;
float:left; change to right
font-family:verdana,helvetica,sans-serif;
font-size:1em;
}

i have no idea how you want this pages style too look so , this might help to organize the page a bit better.

Tried that option, but doesnt work.
The text is still running through text.

sigh.....:lookaroun

tnx though.:shocking:

Anyone??? HELP????:oops::oops::no::no::