Kidson Talks | The E-commerce Chemist

SEO | E-COMMERCE | EBAY - This is my journey as an E-commerce Consultant

Kidson Talks | The E-commerce Chemist header image 2

eBay Shop Design - Playing with Nested Table Backgrounds

April 23rd, 2008 · 1 Comment

Lesson Three: Changing the backgrounds for the nested tables 

Right now, let experiment to how many times we need to mention table, to get a coloured background in different sections! Try adding these snippets of code to your css file.


table
{
background:#C0C0C0;
}

Using table once just colours the entire background within your eBay shop, including outside your shop front. All the normal white background, all grey.


table table
{
background:#C0C0C0;
}

Using table twice, only fills the background of your eBay shop with colour, as well as the eBay header :(


table table table
{
background:#C0C0C0;
}

Ah! This now leaves out the eBay header, so just the shop elements are coloured. Nothing much happens for four ‘tables’ but with 5 mentions of table:


table table table table table
{
background:#C0C0C0;
}

the promotion boxes, shop page boxes and the background to the gallery is coloured.

Add a sixth table and only the promotion boxes are coloured.


table table table table table table
{
background:#C0C0C0;
}

Seven tables and only the top promotions boxes are coloured.


table table table table table table table
{
background:#C0C0C0;
}

That is as far as you can go!

The next post will be about centring your eBay shop and fixing the width to 800px.

Share and Enjoy: These icons link to social bookmarking sites where readers can share and discover new web pages.
  • bodytext
  • del.icio.us
  • Netvouz
  • MisterWong
  • BlinkList
  • Furl
  • Reddit
  • StumbleUpon
  • Technorati
  • YahooMyWeb
  • SphereIt
  • Sphinn
  • Wists

Category eBay

Tags: , , ,

1 response so far ↓

  • 1 Kidson Talks | The E-commerce Chemist // Apr 24, 2008 at 5:35 pm

    Controlling the page width of your eBay shop…

    Lesson Four: Controlling page width
    Slip into your CSS file this code:
    .pagecontainer
    {
    width:900px;
    margin:10px auto 10px auto;
    }
    The margin section makes sure the shop is centred.
    So, bet you are wondering what the css file looks like now? I didn&#82…