2 replies [Last post]
mineallmine
mineallmine's picture
User offline. Last seen 2 years 19 weeks ago. Offline
newbie
Joined: 2010-01-07
Posts: 1
Points: 2

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 Smile

I'd be very grateful of anyhelp that can be offered... hopefully it's something straight forward!

Thanks

Vic

CupidsToejam
CupidsToejam's picture
User offline. Last seen 17 weeks 5 hours ago. Offline
rank Guru
Guru
Timezone: GMT-6
Joined: 2008-08-15
Posts: 2634
Points: 1552

4

4, why so many?


First basic few steps in building a webpage
1. Gather and collect content.
2. Organize the content into meaningful semantic valid HTML
3. Design the prototype
4. Style using CSS

http://www.pixelbehavior.com

Hugo
Hugo's picture
User offline. Last seen 15 hours 39 min ago. Offline
rank Moderator
Moderator
Timezone: GMT+1
Joined: 2004-06-06
Posts: 15197
Points: 2300

Cos the site was running slow

Cos the site was running slow and rather than wait for the submit to run or timeout the user Wink clicked repeatedly on that submit.

I will delete the other three posts.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me