Zen Cart Logo
trapezoid-twopenny
Open navigation menu
Home Community Forum Plugins
Documentation
For Developers For Storeowners
Services Donate Get Started
Forums / Templates, Stylesheets, Page Layout / Edit the table width of listing product

Edit the table width of listing product

Locked
Results 1 to 10 of 10
This thread is locked. New replies are disabled.
07 Sep 2009, 12:58
#1
dylandaddy avatar

dylandaddy

New Zenner

Join Date:
Sep 2009
Posts:
9
Plugin Contributions:
0

Edit the table width of listing product

Hi experts,

I was having a hard time trying to edit the table width of the listing products.

My source code is like this now:

<table width="100%" border="0" cellpadding="0" cellspacing="0">

However, i wish i could edit it to 500 px so my product table won't go over my whole page width of 850px (two column of 150 on the both sides).

Anyone knows how to do it??

http://topallinc.com/store/index.php?main_page=index&cPath=1


Thanks in advance !!
07 Sep 2009, 13:03
#2
dylandaddy avatar

dylandaddy

New Zenner

Join Date:
Sep 2009
Posts:
9
Plugin Contributions:
0

Re: Edit the table width of listing product

Hi experts,

I was having a hard time trying to edit the table width of the listing products.

My source code is like this now:

<table width="100%" border="0" cellpadding="0" cellspacing="0">

However, i wish i could edit it to 500 px so my product table won't go over my whole page width of 850px (two column of 150 on the both sides).

Anyone knows how to do it??

http://topallinc.com/store/index.php...=index&cPath=1


Thanks in advance !!
dylandaddy is online now Report Post Edit/Delete Message
07 Sep 2009, 14:17
#3
kim avatar

kim

Obaa-san

Join Date:
Jun 2003
Posts:
26,564
Plugin Contributions:
0

Re: Edit the table width of listing product

Moderator's note - One post per topic, please. Extra posts have been removed.
07 Sep 2009, 15:50
#4
stevesh avatar

stevesh

Black Belt

Join Date:
Feb 2005
Posts:
19,793
Plugin Contributions:
2

Re: Edit the table width of listing product

You'll have to remove the red part here:


#productMainImage, #reviewsInfoDefaultProductImage, #productReviewsDefaultProductImage, #reviewWriteMainImage {
margin:10px; text-align:center; line-height:20px;

and fiddle with the width here, probably after breaking out productMainImage to it's own statement:

.centeredContent, TH, #cartEmptyText, #cartBoxGVButton, #navCatTabsWrapper, #navEZPageNextPrev, #bannerOne, #bannerTwo, #bannerThree, #bannerFour, #bannerFive, #bannerSix, #siteinfoLegal, #siteinfoCredits, #siteinfoStatus, #siteinfoIP, .center, .cartRemoveItemDisplay, .cartQuantityUpdate, .cartQuantity, #cartBoxGVBalance, .leftBoxHeading, .centerBoxHeading,.rightBoxHeading, .productListing-data, .accountQuantityDisplay, .ratingRow, LABEL#textAreaReviews, #productMainImage, #reviewsInfoDefaultProductImage, #productReviewsDefaultProductImage, #reviewWriteMainImage, .centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .additionalImages, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatured, .centerBoxContentsNew, .gvBal, .attribImg {
width:850px;
margin-right: auto;
margin-left: auto;
}
08 Sep 2009, 02:00
#5
dylandaddy avatar

dylandaddy

New Zenner

Join Date:
Sep 2009
Posts:
9
Plugin Contributions:
0

Re: Edit the table width of listing product

i tried but it didnt work out. i noticed the table expands when i put extra long Products Description. Is there any way to kind of constrain the width of table somehow??

Here is my site:
http://topallinc.com/store/index.php?main_page=index&cPath=1

Thanks again
08 Sep 2009, 04:20
#6
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Posts:
21,876
Plugin Contributions:
6

Re: Edit the table width of listing product

You need to remove the width completely from this rule, as it applies to a wide range of elements, some of which are only supposed to be small things like a sidebox heading:
.centeredContent, TH, #cartEmptyText, #cartBoxGVButton, #navCatTabsWrapper, #navEZPageNextPrev, #bannerOne, #bannerTwo, #bannerThree, #bannerFour, #bannerFive, #bannerSix, #siteinfoLegal, #siteinfoCredits, #siteinfoStatus, #siteinfoIP, .center, .cartRemoveItemDisplay, .cartQuantityUpdate, .cartQuantity, #cartBoxGVBalance, .leftBoxHeading, .centerBoxHeading,.rightBoxHeading, .productListing-data, .accountQuantityDisplay, .ratingRow, LABEL#textAreaReviews, #productMainImage, #reviewsInfoDefaultProductImage, #productReviewsDefaultProductImage, #reviewWriteMainImage, .centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .additionalImages, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatured, .centerBoxContentsNew, .gvBal, .attribImg {
width:850px;
margin-right: auto;
margin-left: auto;
}

You entered this for the description of a test product:

BBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBB

A "word" that long with no spaces will cause problems. Try some real text and see how it behaves.
08 Sep 2009, 07:18
#7
dylandaddy avatar

dylandaddy

New Zenner

Join Date:
Sep 2009
Posts:
9
Plugin Contributions:
0

Re: Edit the table width of listing product

Oh my god !!! That works !!!!! Thank you so much!!!!!!!!
08 Sep 2009, 08:42
#8
dylandaddy avatar

dylandaddy

New Zenner

Join Date:
Sep 2009
Posts:
9
Plugin Contributions:
0

Re: Edit the table width of listing product

Ohh...sorry to bother you guys again.

gjh42: i actually copy a formal paragraph and past into the description and it work well.

Both gjh42 and stevesh: i did what you told, and it works in my dreamweaver, so i save the stylesheet.css and stylesheet_main.css and upload to my FTP.
However, when i download the html from my browser and open back in my Dreamweaver, coding width:850px; and text-align:center;
still exsist respectly. I wonder is there anything that overides it or did i miss anything.


Appreciated
08 Sep 2009, 14:09
#10
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Posts:
21,876
Plugin Contributions:
6

Re: Edit the table width of listing product

You did not remove the width: 850px; as I suggested. When I tested that in Web Developer on your site on the product info page, the product description went back to the correct width.

The product listing shows the left column and center column correctly, with right column turned off. Why do you think there is a problem there?