Hi all,
I have a webpage that I'm trying to use the html from to use as an ebay template. I have done this before, and it's been a pretty simple process copying the html into the ebay html content section.
This is the first time I've used css (and I've kinda just found my own way around it here...) and although it shows everything correctly, there's a clear problem with the formatting.
I thought I may be better off asking in a place where people know what they're on about, rather than spend the next few hours trying to find the problem by trial and error (which is how I normally do things...!)
The messed up formatting within ebay is available on item number 330393205074 EbayUK.
CSS copied below:
[/*
*/
*
{
margin: 0px;
padding: 0px;
}
a:link {
color: #7BBB15;
}
a:hover {
text-decoration: none;
color: #FF0000;
}
a:visited {
color: #7BBB15;
}
body {
background: #D2D2D2 url(images/back_all.gif) repeat-x;
font: 13px Tahoma, Verdana, Arial, Helvetica, sans-serif;
color: #666666;
}
#content
{
margin: 0 auto;
width: 765px;
text-align: left;
}
#back
{
width: 765px;
}
#header {
height: 103px;
text-align: left;
}
#menu1
{
width: 695px;
height: 45px;
padding-left: 70px;
}
#menu ul {
list-style: none;
}
#menu li {
display: inline;
}
#menu a {
float: left;
width: 79px;
height: 32px;
display: block;
text-align: center;
text-decoration: none;
color: #ffffff;
font-weight: bold;
font-size: 12px;
text-transform: uppercase;
}
#menu a:hover {
width: 79px;
height: 32px;
color: #ffffff;
text-decoration: underline;
}
#button1 a
{
background: url(images/button1.png) no-repeat;
height: 25px;
width: 125px;
padding-top: 20px;
}
#button1 a:hover
{
background: url(images/button1_r.png) no-repeat;
height: 34px;
width: 125px;
margin-top: -9px;
}
#button2 a
{
background: url(images/button2.png) no-repeat;
height: 25px;
width: 125px;
padding-top: 20px;
}
#button2 a:hover
{
background: url(images/button2_r.png) no-repeat;
height: 34px;
width: 125px;
margin-top: -9px;
}
#button3 a
{
background: url(images/button3.png) no-repeat;
height: 25px;
width: 125px;
padding-top: 20px;
}
#button3 a:hover
{
background: url(images/button3_r.png) no-repeat;
height: 34px;
width: 125px;
margin-top: -9px;
}
#button4 a
{
background: url(images/button4.png) no-repeat;
height: 25px;
width: 125px;
padding-top: 20px;
}
#button4 a:hover
{
background: url(images/button4_r.png) no-repeat;
height: 34px;
width: 125px;
margin-top: -9px;
}
#button5 a
{
background: url(images/button5.png) no-repeat;
height: 25px;
width: 125px;
padding-top: 20px;
}
#button5 a:hover
{
background: url(images/button5_r.png) no-repeat;
height: 34px;
width: 125px;
margin-top: -9px;
}
#logo {
width: 745px;
height: 48px;
text-align: left;
padding-left: 20px;
padding-top: 10px;
}
#logo a {
text-decoration: none;
text-transform: lowercase;
font-style: italic;
font-size: 18px;
color: #0066cc;
}
#logo H1, #logo H2
{
line-height:24px;
}
#logo H2 a
{
font-size: 16px;
color: #FFFFFF;
}
#top
{
background: url(images/top.gif) no-repeat;
height: 10px;
}
#main
{
width: 765px;
background: #FFFFFF;
}
#boxes
{
width: 765px;
height: 212px;
margin-bottom: 10px;
}
#box1
{
width: 203px;
height: 203px;
float: left;
font-size: 11px;
background: url(images/box1.jpg) no-repeat;
}
#box2
{
width: 203px;
height: 203px;
float: left;
font-size: 11px;
background: url(images/box2.jpg) no-repeat;
}
#box3
{
width: 203px;
height: 203px;
float: left;
font-size: 11px;
background: url(images/box3.jpg) no-repeat;
}
#box1 h2, #box2 h2, #box3 h2
{
color: #FFFFFF;
font-size: 36px;
text-align: center;
font-weight: bold;
padding-bottom: 10px;
}
#box1 h3, #box2 h3, #box3 h3
{
color: #FFFFFF;
font-size: 28px;
text-align: center;
font-weight: bold;
padding-bottom: 10px;
}
#box1 h4, #box2 h4, #box3 h4
{
color: #999999;
font-size: 16px;
text-align: center;
font-weight: bold;
padding-bottom: 10px;
}
#box1, #box2, #box3
{
color: #000000;
margin-left: 16px;
margin-top: 10px;
padding: 15px;
}
#top1
{
width: 733px;
background: url(images/top1.gif) no-repeat;
height: 15px;
}
#bottom1
{
width: 733px;
background: url(images/bottom1.gif) no-repeat top;
height: 11px;
}
#page
{
width: 733px;
margin: 0 auto;
}
#back1
{
background: #ECECEC;
}
#left
{
width: 207px;
margin-left: 10px;
}
#left H3
{
width: 182px;
height: 46px;
font-size: 14px;
font-weight: bold;
padding-left: 25px;
padding-top: 10px;
text-transform: uppercase;
color: #ffffff;
background: url(images/title.gif) repeat-x
}
#left ul {
list-style: none;
}
#left li ul {
border: 0px;
margin-left: 20px;
margin-bottom: 10px;
}
#left li li {
padding: 4px 10px;
background: url(images/small.gif) no-repeat left;
}
#left a {
color: #7BBB15;
}
#left a:visited {
color: #7BBB15;
}
#left p
{
padding: 10px;
}
#calendar1 {
padding: 0 10px 20px 10px;
}
#calendar table {
width: 100%;
text-align: center;
}
#calendar thead {
}
#calendar tbody td {
border: 1px solid #F1F1F1;
}
#calendar #prev {
text-align: left;
}
#calendar #next {
text-align: right;
}
#calendar tfoot a {
text-decoration: none;
font-weight: bold;
}
#calendar #now {
background: #696969;
border: 1px solid #ff0000;
font-weight: bold;
color: #ffffff
}
#right
{
float: right;
width: 450px;
padding-right: 10px;
}
#right H4
{
margin: 0;
padding: 0px;
font-size: 12px;
color: #7BBB15;
}
#right a
{
color: #7BBB15;
text-decoration: none;
}
#right p {
margin: 0;
padding: 0;
padding-bottom: 10px;
}
#right h2 {
margin: 0;
padding: 0;
padding-top: 10px;
color: #7BBB15;
text-align: center;
}
#right h3 {
margin: 0;
padding: 0;
padding-top: 0px;
color: #FF3300;
text-align: center;
}
#right ol, #right ul
{
margin-left: 30px;
}
.date {
text-align: right;
color: #808080;
font-size: 11px;
}
.date a {
color: #D72020;
}
#footer {
height: 29px;
clear: both;
padding-top: 20px;
padding-bottom: 10px;
background: url(images/bottom.gif) no-repeat top;
}
#footer p {
margin: 0;
font-size: 10px;
text-align: center;
color: #666666;
}
#footer a {
color: #666666;
}]
Complete novice so please go easy 
I'd be very grateful of anyhelp that can be offered... hopefully it's something straight forward!
Thanks
Vic


clicked repeatedly on that submit.