No replies
Tony States
Offline
newbie
USA
Last seen: 10 years 11 weeks ago
USA
Timezone: GMT-7
Joined: 2011-10-29
Posts: 6
Points: 10

Thanks in advance for any help Smile
I am a newbie at CSS and I don't like Tables at all... I don't really know how to control them with CSS?
but the shopping cart my client wants to use has them all over...
I am trying to get the content in the middle of the page to spread out so it is not all bunched up.
http://www.bettiesfashions.com/store/pc/viewCart.asp?cs=1
I would like it to spread out to the same width as the header and lower area's.
Please let me know if you need any other code Smile

viewCart.asp--CODE--YourShoppingCartContains
 
 
 
<div id="pcMain">
 
<form method="post" action="cRec.asp" name="recalculate" class="pcForms" onsubmit="javascript: if ((RemainIssue!='') || (RemainIssue1!='')) {alert('Please edit the product quantities to comply with 
 
the minimum order requirements.'); return(false);}">
	<table class="pcMainTable">
<tbody><tr> 
			<td>
				<h1>Your shopping cart contains...</h1>
			</td>
		</tr>
		<tr>
			<td align="right">
 
					<a href="default.asp"><img src="images/sample/pc_button_continue_shop.gif" alt="Continue shopping" border="0"></a>
 
							&nbsp;<a href="onepagecheckout.asp" onclick="javascript: if ((RemainIssue!='') || (RemainIssue1!='')) {alert('Please edit the 
 
product quantities to comply with the minimum order requirements.'); return(false);} return(checkQtyChange());"><img src="images/sample/pc_button_checkout.gif" alt="Checkout" 
 
border="0"></a>
 
			</td>
 
		</tr>
 
 
 
 
		<tr> 
			<td>
			<table class="pcShowCart">
 
				<tbody><tr> 
					<th width="6%"> 
						<div style="text-align: left;">Qty.</div>
					</th>
					<th width="57%">
						<div style="text-align: left;">Description</div>
 
					</th>
					<th nowrap="nowrap" width="12%">
						<div style="text-align: left;">Unit Price</div>
					</th>
					<th width="12%">
						<div style="text-align: left;">Price</div>
					</th>
					<th nowrap="nowrap">
 
 
                    </th>
					<th width="13%">&nbsp;</th>
				</tr>
				<tr>
					<td class="pcSpacer" colspan="6"></td>
				</tr>
 
						<tr> 
							<td> 
 
								    <input name="Cant1" size="3" value="1" onblur="checkproqty(this,0,0,0,0)" onkeypress="return handleEnter(this, 
 
event)" type="text">
 
								<input name="SavQty1" value="1" type="hidden">
 
 
							</td>
 
 
 
							<td>
 
 
								<table border="0" cellpadding="0" cellspacing="0" width="100%">
									<tbody><tr>
										<td>
 
												<a href="viewPrd.asp?idproduct=3" 
 
onmouseover="javascript:document.getPrd.idproduct.value='3'; sav_callxml='1'; return runXML1('prd_3');" onmouseout="javascript: sav_callxml=''; hidetip();">
												<img src="catalog/blkimpala300x225.jpg" alt="Show product details for 
 
Impala Peep Toe" hspace="2" width="35">
												</a>
 
										</td>
 
										<td align="left" width="100%">							
 
 
 
 
 
											<a href="viewPrd.asp?idproduct=3" 
 
onmouseover="javascript:document.getPrd.idproduct.value='3'; sav_callxml='1'; return runXML1('prd_3');" onmouseout="javascript: sav_callxml=''; hidetip();">Impala Peep Toe</a> <span 
 
class="pcSmallText">(blkimp)</span>											
 
 
 
										</td>
									</tr>
								</tbody></table>
 
							</td>
 
 
 
 
							<td>
                            	<div class="pcShowCartPrices">
 
								$69.95
                                </div>
							</td>
							<td>
                                <div class="pcShowCartPrices">
								$69.95
                                </div>
							</td>
							<td>
                                <div style="text-align: center;">
 
 
                                </div>
                            </td>
							<td>
                            	<div style="text-align: right;">
 
								    <a href="cRemv.asp?pcCartIndex=1"><img src="images/sample/pc_button_remove.gif" alt="Remove from 
 
cart"></a>
 
                                </div>
							</td>
						</tr>
 
							<tr valign="top">
 
								<td>&nbsp;</td>
								<td colspan="3">
									<table border="0" cellpadding="0" cellspacing="0" width="100%">
 
										<tbody><tr>
											<td width="67%"><p>Size: 6.5</p></td>
											<td align="right" width="33%">						
 
 
												&nbsp;			
											</td>
										</tr>
 
 
										<tr valign="top">
											<td colspan="3" class="pcSmallText">
												<p>
													<a href="viewPrd.asp?
 
idproduct=3&amp;index=1&amp;imode=updOrd">
														Edit product option(s)
													</a>
												</p>
											</td>
										</tr>							
 
								</tbody></table>
 
 
							</td>
							<td>&nbsp;</td>
							<td>&nbsp;</td>
						</tr>
 
 
						<tr>
							<td colspan="6"><hr></td>
						</tr>
 
 
				<tr>
 
					<td colspan="2">
						<div><input id="submit" name="Submit" src="images/sample/pc_button_recalculate.gif" onclick="javascript: if ((RemainIssue!='') || 
 
(RemainIssue1!='')) {alert('Please edit the product quantities to comply with the minimum order requirements.'); return(false);} else {return(true);}" type="image"></div>
 
									<div style="padding-top: 3px;"><a href="onepagecheckout.asp" onclick="javascript: if ((RemainIssue!='') || 
 
(RemainIssue1!='')) {alert('Please edit the product quantities to comply with the minimum order requirements.'); return(false);} return(checkQtyChange());"><img 
 
src="images/sample/pc_button_checkout.gif" alt="Checkout" border="0"></a></div>
 
					</td>
					<td colspan="4" align="right">
					<div>
					<strong>Total: $69.95</strong>
					</div>
 
 
 
 
					</td>
				</tr>
			</tbody></table>
		</td>
	</tr>
 
 
	<tr>
		<td><hr></td>
	</tr>
 
			<tr>
 
				<td>
					<a href="javascript:winShipPreview('estimateShipCost.asp')">Estimated Shipping Charges</a>
				</td>
			</tr>
 
 
	</tbody></table>
</form>
</div>
</td>
</tr>
</tbody></table>
<style>

Below is some of the CSS that Google chrome shows...

pcStorefront.css:63
 
.pcMainTable {
font-family: Georgia, "Times New Roman", Times, serif;
margin: 0;
padding: 5;
outline: 0;
font-size: 16px;
vertical-align: baseline;
background: transparent;
margin-left: auto;
margin-right: auto;
width: 80%;
border: 0;
border-collapse: collapse;
}

Best Regards & Thanks,
Tony States