Luke2000
07-19-2007, 04:58 AM
This is my first attempt at listing things on ebay. I have written this code, it works but in FF I have to lengthen the page manually so that the description doesn't hang out of the bottom.
I think it is because the display case is floating but can't figure out how to fix it.
Anyone got any suggestions please?
<style type="text/css">
#fake_body
{
width: 100%;
background: #FFFFFF;
_text-align: center;
}
#container
{
text-align: left;
margin-left: auto;
margin-right: auto;
width: 750px;
height: 1900px;
_height: 2000px;
background: transparent;
border-left: 2px solid #000000;
border-right: 2px solid #000000;
border-bottom: 2px solid #000000;
}
#header
{
width: 750px;
height: 120px;
_margin-bottom: -4px;
}
#showcase
{
width: 210px;
text-align: center;
_margin-bottom: -4px;
}
#showcase_img
{
width: 210px;
height: 21px;
border-right: 2px solid #000000;
}
#thumb
{
width: 210px;
height: 280px;
_margin-top: -4px;
border-right: 2px solid #000000;
}
#thumb_5
{
width: 210px;
height: 280px;
_margin-top: -4px;
_margin-bottom: -4px;
border-right: 2px solid #000000;
border-bottom: 2px solid #000000;
}
#description
{
width: 538px;
float: right;
margin-top: -1288px;
_margin-top: -1280px;
_margin-right: -4px;
position: relative;
background: #FFFFFF;
font: 14px arial, sans-serif;
line-height: 35px;
}
#desc_cont
{
padding-right: 25px;
padding-left: 25px;
}
#quote_box
{
width: 538px;
float: right;
margin-top: -1423px;
_margin-top: -1419px;
_margin-right: -4px;
position: relative;
background: transparent;
line-height: 25px;
border-bottom: 2px solid #000000;
}
#move
{
position: relative;
left: 356px;
}
#quote
{
font: bold italic 20px times new roman, serif;
color: #555555;
background: transparent;
padding: 15px;
}
#quote_attributation
{
font: bold 13px arial, sans-serif;
color: #890000;
background: transparent;
padding-left: 350px;
}
#heading_1
{
font: bold italic 18px arial, sans-serif;
color: #6D0303;
}
#heading
{
font: bold italic 18px arial, sans-serif;
color: #6D0303;
padding-left: 25px;
}
#sub_heading
{
font: bold 15px arial, sans-serif;
color: #555555;
}
#banner
{
width: 538px;
height: 13px;
background-image: url('http://www.bibliocommerce.com/ebaylistings/graphics/banner_bd.jpg');
background-repeat: repeat-x;
margin-top: 15px;
margin-bottom: 20px;
_margin-bottom: 12px;
}
#inset
{
padding-left: 35px;
padding-right: 25px;
font: 14px arial, sans-serif;
line-height: 25px;
}
#footer
{
margin-top: 30px;
margin-bottom: 30px;
font: bold italic 18px arial, sans-serif;
color: #6D0303;
text-align: center;
}
#fake_body a:link {
color: #6D0303;
text-decoration: none;
border: none;
font-weight: bold;
}
#fake_body a:visited {
color: #6D0303;
text-decoration: none;
border: none;
font-weight: bold;
}
#fake_body a:hover {
color: #6D0303;
text-decoration: none;
border: none;
font-weight: bold;
}
#fake_body a:active {
color: #6D0303;
text-decoration: none;
border: none;
font-weight: bold;
}
</style>
<div id="fake_body">
<div id="container">
<img id="header" src="http://www.bibliocommerce.com/ebaylistings/graphics/header.jpg" alt="BiblioCommerce©" />
<div id="showcase">
<img id="showcase_img" src="http://www.bibliocommerce.com/ebaylistings/graphics/showcase.gif" alt="BiblioCommerce© Showcase" />
<img id="thumb" src="http://www.bibliocommerce.com/ebaylistings/graphics/012/thumb_1.JPG" alt="BiblioCommerce©: Thumbnail 1" />
<img id="thumb" src="http://www.bibliocommerce.com/ebaylistings/graphics/012/thumb_2.JPG" alt="BiblioCommerce©: Thumbnail 2" />
<img id="thumb" src="http://www.bibliocommerce.com/ebaylistings/graphics/012/thumb_3.JPG" alt="BiblioCommerce©: Thumbnail 3" />
<img id="thumb" src="http://www.bibliocommerce.com/ebaylistings/graphics/012/thumb_4.JPG" alt="BiblioCommerce©: Thumbnail 4" />
<img id="thumb_5" src="http://www.bibliocommerce.com/ebaylistings/graphics/012/thumb_5.JPG" alt="BiblioCommerce©: Thumbnail 5" />
</div>
<div id="quote_box" style="background-color: #FFFFFF; background-image: url('http://www.bibliocommerce.com/ebaylistings/graphics/quote_bd.jpg');">
<img src="http://www.bibliocommerce.com/ebaylistings/graphics/quote.gif" id="move" width="182" height="21" alt="Choice Quotes" />
<div id="quote">
"When I get a little money I buy books; and if any is left, I buy food and clothes."<br />
<span id="quote_attributation">Desiderius Erasmus</span>
</div>
</div>
<div id="description">
<div id="desc_cont">
<span id="heading_1">Description</span> <br />
<span id="sub_heading">Author:</span> Giovanni Boccaccio</span><br />
<span id="sub_heading">Title:</span> The Decameron<br />
<span id="sub_heading">Publisher:</span> The Navarre Society Ltd.<br />
<span id="sub_heading">Publication Date:</span> c.1910<br />
<span id="sub_heading">Binding:</span> Leather<br />
<span id="sub_heading">Condition:</span> Binding: Good/Very Good - Interior: Very Good/Fine<br />
<span id="sub_heading">Size:</span> 2 Volumes: 150mm x 230mm x 55mm<br />
<span id="sub_heading">Weight:</span> 2200g<br />
<span id="sub_heading">Notes:</span> Vol. 1: 332pp, 9 plates - Vol. 2: 404pp, 6 plates; gorgeous bindings, far superior to usual cloth bound volumes, tissue guards intact, spines slightly discoloured, front hinge repaired on Vol. 1, a lovely set<br />
<span id="sub_heading">Keywords:</span> Fine bindings, erotica, leather, gilt, embossed, very rare, limited edition<br />
<span id="sub_heading">Links:</span> <a href="http://www.abebooks.co.uk/servlet/SearchResults?tn=decameron&sortby=3&sts=t&an=Giovanni+Boccaccio&pn=navarre&bi=0&bx=off&y=19&ds=30&x=55&kn=leather" target="_blank"> Reference</a><br />
</div>
<div id="banner"></div>
<span id="heading">Condition Guidelines</span>
<div id="inset">
<p>Below is a list of conditions and a description of some of the possible defects of each condition:<li> Fine - Almost as new, i.e. very fine tears</li>
<li> Very Good - Slight chips, small tears, slight foxing</li>
<li> Good - Few medium tears, scuffs, chips, foxing, slight bumps</li>
<li> Average - Larger tears, wear consumate with age, chips, scuffs, foxing, blotches, worn hinges, bumps</li>
<li> Poor - Spine detached, grubby, foxing, chips, scuffs, disbound, rips</li></p>
<b>NB:</b> We are are always over cautious when grading books
</div>
<div id="banner"></div>
<span id="heading">Postage & Packaging</span>
<div id="inset">
<p>Postage costs are always stated at the top of the listing. We aim to get your book to you within 5 working days.</p>
<p>All our books our packaged using the best quality materials, we make every precaution to ensure your book arrives to you in the condition it left. We offer 1st and 2nd class postage on all items we sell, if you do not contact us and specify the service you require we will always post your book 2nd class to keep your costs down.</p>
<p>If you have any specific postage requests, ie. gift wrapping etc., then please do not hesitate to contact us.</p>
<p>We obtain receipt of postage for every item we despatch, if you would like a copy of this then please contact us.</p>
</div>
<div id="banner"></div>
<span id="heading">Terms & Conditions</span>
<div id="inset">
<p> We will accept returns on all books returned within 30 days of purchase in original condition for any of the following reasons:</p>
<li>The condition of the item is not as described</li>
<li>The item arrived in an unsatisfactory condition</li>
<li>It becomes apparent that the item was listed inaccurately</li>
</div>
<div id="banner"></div>
<span id="heading">Payment</span>
<div id="inset">
<p>We accept payment by PayPal©, postal order and cheque. No items will be despatch until payment is cleared.</p>
</div>
</div>
</div>
</div>
I would like to be able to add content in the description and not have to worry about the payment instructions part hanging out of the bottom. It works ok in IE but not FF. I use FF.
I think it is because the display case is floating but can't figure out how to fix it.
Anyone got any suggestions please?
<style type="text/css">
#fake_body
{
width: 100%;
background: #FFFFFF;
_text-align: center;
}
#container
{
text-align: left;
margin-left: auto;
margin-right: auto;
width: 750px;
height: 1900px;
_height: 2000px;
background: transparent;
border-left: 2px solid #000000;
border-right: 2px solid #000000;
border-bottom: 2px solid #000000;
}
#header
{
width: 750px;
height: 120px;
_margin-bottom: -4px;
}
#showcase
{
width: 210px;
text-align: center;
_margin-bottom: -4px;
}
#showcase_img
{
width: 210px;
height: 21px;
border-right: 2px solid #000000;
}
#thumb
{
width: 210px;
height: 280px;
_margin-top: -4px;
border-right: 2px solid #000000;
}
#thumb_5
{
width: 210px;
height: 280px;
_margin-top: -4px;
_margin-bottom: -4px;
border-right: 2px solid #000000;
border-bottom: 2px solid #000000;
}
#description
{
width: 538px;
float: right;
margin-top: -1288px;
_margin-top: -1280px;
_margin-right: -4px;
position: relative;
background: #FFFFFF;
font: 14px arial, sans-serif;
line-height: 35px;
}
#desc_cont
{
padding-right: 25px;
padding-left: 25px;
}
#quote_box
{
width: 538px;
float: right;
margin-top: -1423px;
_margin-top: -1419px;
_margin-right: -4px;
position: relative;
background: transparent;
line-height: 25px;
border-bottom: 2px solid #000000;
}
#move
{
position: relative;
left: 356px;
}
#quote
{
font: bold italic 20px times new roman, serif;
color: #555555;
background: transparent;
padding: 15px;
}
#quote_attributation
{
font: bold 13px arial, sans-serif;
color: #890000;
background: transparent;
padding-left: 350px;
}
#heading_1
{
font: bold italic 18px arial, sans-serif;
color: #6D0303;
}
#heading
{
font: bold italic 18px arial, sans-serif;
color: #6D0303;
padding-left: 25px;
}
#sub_heading
{
font: bold 15px arial, sans-serif;
color: #555555;
}
#banner
{
width: 538px;
height: 13px;
background-image: url('http://www.bibliocommerce.com/ebaylistings/graphics/banner_bd.jpg');
background-repeat: repeat-x;
margin-top: 15px;
margin-bottom: 20px;
_margin-bottom: 12px;
}
#inset
{
padding-left: 35px;
padding-right: 25px;
font: 14px arial, sans-serif;
line-height: 25px;
}
#footer
{
margin-top: 30px;
margin-bottom: 30px;
font: bold italic 18px arial, sans-serif;
color: #6D0303;
text-align: center;
}
#fake_body a:link {
color: #6D0303;
text-decoration: none;
border: none;
font-weight: bold;
}
#fake_body a:visited {
color: #6D0303;
text-decoration: none;
border: none;
font-weight: bold;
}
#fake_body a:hover {
color: #6D0303;
text-decoration: none;
border: none;
font-weight: bold;
}
#fake_body a:active {
color: #6D0303;
text-decoration: none;
border: none;
font-weight: bold;
}
</style>
<div id="fake_body">
<div id="container">
<img id="header" src="http://www.bibliocommerce.com/ebaylistings/graphics/header.jpg" alt="BiblioCommerce©" />
<div id="showcase">
<img id="showcase_img" src="http://www.bibliocommerce.com/ebaylistings/graphics/showcase.gif" alt="BiblioCommerce© Showcase" />
<img id="thumb" src="http://www.bibliocommerce.com/ebaylistings/graphics/012/thumb_1.JPG" alt="BiblioCommerce©: Thumbnail 1" />
<img id="thumb" src="http://www.bibliocommerce.com/ebaylistings/graphics/012/thumb_2.JPG" alt="BiblioCommerce©: Thumbnail 2" />
<img id="thumb" src="http://www.bibliocommerce.com/ebaylistings/graphics/012/thumb_3.JPG" alt="BiblioCommerce©: Thumbnail 3" />
<img id="thumb" src="http://www.bibliocommerce.com/ebaylistings/graphics/012/thumb_4.JPG" alt="BiblioCommerce©: Thumbnail 4" />
<img id="thumb_5" src="http://www.bibliocommerce.com/ebaylistings/graphics/012/thumb_5.JPG" alt="BiblioCommerce©: Thumbnail 5" />
</div>
<div id="quote_box" style="background-color: #FFFFFF; background-image: url('http://www.bibliocommerce.com/ebaylistings/graphics/quote_bd.jpg');">
<img src="http://www.bibliocommerce.com/ebaylistings/graphics/quote.gif" id="move" width="182" height="21" alt="Choice Quotes" />
<div id="quote">
"When I get a little money I buy books; and if any is left, I buy food and clothes."<br />
<span id="quote_attributation">Desiderius Erasmus</span>
</div>
</div>
<div id="description">
<div id="desc_cont">
<span id="heading_1">Description</span> <br />
<span id="sub_heading">Author:</span> Giovanni Boccaccio</span><br />
<span id="sub_heading">Title:</span> The Decameron<br />
<span id="sub_heading">Publisher:</span> The Navarre Society Ltd.<br />
<span id="sub_heading">Publication Date:</span> c.1910<br />
<span id="sub_heading">Binding:</span> Leather<br />
<span id="sub_heading">Condition:</span> Binding: Good/Very Good - Interior: Very Good/Fine<br />
<span id="sub_heading">Size:</span> 2 Volumes: 150mm x 230mm x 55mm<br />
<span id="sub_heading">Weight:</span> 2200g<br />
<span id="sub_heading">Notes:</span> Vol. 1: 332pp, 9 plates - Vol. 2: 404pp, 6 plates; gorgeous bindings, far superior to usual cloth bound volumes, tissue guards intact, spines slightly discoloured, front hinge repaired on Vol. 1, a lovely set<br />
<span id="sub_heading">Keywords:</span> Fine bindings, erotica, leather, gilt, embossed, very rare, limited edition<br />
<span id="sub_heading">Links:</span> <a href="http://www.abebooks.co.uk/servlet/SearchResults?tn=decameron&sortby=3&sts=t&an=Giovanni+Boccaccio&pn=navarre&bi=0&bx=off&y=19&ds=30&x=55&kn=leather" target="_blank"> Reference</a><br />
</div>
<div id="banner"></div>
<span id="heading">Condition Guidelines</span>
<div id="inset">
<p>Below is a list of conditions and a description of some of the possible defects of each condition:<li> Fine - Almost as new, i.e. very fine tears</li>
<li> Very Good - Slight chips, small tears, slight foxing</li>
<li> Good - Few medium tears, scuffs, chips, foxing, slight bumps</li>
<li> Average - Larger tears, wear consumate with age, chips, scuffs, foxing, blotches, worn hinges, bumps</li>
<li> Poor - Spine detached, grubby, foxing, chips, scuffs, disbound, rips</li></p>
<b>NB:</b> We are are always over cautious when grading books
</div>
<div id="banner"></div>
<span id="heading">Postage & Packaging</span>
<div id="inset">
<p>Postage costs are always stated at the top of the listing. We aim to get your book to you within 5 working days.</p>
<p>All our books our packaged using the best quality materials, we make every precaution to ensure your book arrives to you in the condition it left. We offer 1st and 2nd class postage on all items we sell, if you do not contact us and specify the service you require we will always post your book 2nd class to keep your costs down.</p>
<p>If you have any specific postage requests, ie. gift wrapping etc., then please do not hesitate to contact us.</p>
<p>We obtain receipt of postage for every item we despatch, if you would like a copy of this then please contact us.</p>
</div>
<div id="banner"></div>
<span id="heading">Terms & Conditions</span>
<div id="inset">
<p> We will accept returns on all books returned within 30 days of purchase in original condition for any of the following reasons:</p>
<li>The condition of the item is not as described</li>
<li>The item arrived in an unsatisfactory condition</li>
<li>It becomes apparent that the item was listed inaccurately</li>
</div>
<div id="banner"></div>
<span id="heading">Payment</span>
<div id="inset">
<p>We accept payment by PayPal©, postal order and cheque. No items will be despatch until payment is cleared.</p>
</div>
</div>
</div>
</div>
I would like to be able to add content in the description and not have to worry about the payment instructions part hanging out of the bottom. It works ok in IE but not FF. I use FF.