Adding color to content area

  • ciarac
  • Beginner
  • Beginner
  • User avatar
  • Posts: 48
  • Loc: Spain

Post 3+ Months Ago

Hi,

I recently asked for a site review of my website http://www.website-copy-writer.com and I got some great feedback. I'm slowly working my way through it all.
One of the suggestions was to put a light grey color in the content area (suggestion made by kocisz) which is an idea that I like.
I don't know how to do it though.

Do I need to enclose the text in a table?
I'm using css and I really am a novice so any help is greatly appreciated.
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • grinch2171
  • Moderator
  • Genius
  • User avatar
  • Posts: 6807
  • Loc: Martinsburg, WV

Post 3+ Months Ago

The easiest way would be to place all of your content in a <div> and assign the <div> a background color. I see you do have a <div> assigned so you need to add this to your CSS.

Code: [ Select ]
#contentcell {background: #C0C0C0;}


Also in your source code you have <div="contentcell">. You need to change this to <div id="contentcell">.
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8388
  • Loc: USA

Post 3+ Months Ago

grinch2171 wrote:
The easiest way would be to place all of your content in a <div> and assign the <div> a background color. I see you do have a <div> assigned so you need to add this to your CSS.

Code: [ Select ]
#contentcell {background: #C0C0C0;}


Also in your source code you have <div="contentcell">. You need to change this to <div id="contentcell">.


OR change the "#contentcell" to ".contentcell" and make the div "div class="contentcell">" It is more "strict XHTML" valid and it works just the same. It can be done both ways. Just a thought.
  • grinch2171
  • Moderator
  • Genius
  • User avatar
  • Posts: 6807
  • Loc: Martinsburg, WV

Post 3+ Months Ago

Both ways will validate as XHTML Strict.

My understanding of the difference between ID and class is you can use a class multiple times on one page and an ID can only be used once per page.

Quote:
The key thing to know is that IDs identify a specific element and therefore must be unique on the page – you can only use a specific ID once per document. Many browsers do not enforce this rule but it is a basic rule of HTML/XHTML and should be observed. Classes mark elements as members of a group and can be used multiple times, so if you want to define a style which will be applied to multiple elements you should use a class instead.
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8388
  • Loc: USA

Post 3+ Months Ago

oh, then thats why it didn't validate for me. Because I used an ID more than once and it said that I can't use ID in XHTML strict.
  • jameson5555
  • Bronze Robot
  • Bronze Member
  • User avatar
  • Posts: 575
  • Loc: Phoenix, AZ

Post 3+ Months Ago

I noticed that the site seemed to be right justified. You could center it if you wanted pretty easily. You have a class in your CSS that you're not using:

Code: [ Select ]
.maintable {
    width: 760px;
}
  1. .maintable {
  2.     width: 760px;
  3. }


I would change that to a div (since you're only need it once) and wrap it around your entire site. Start it right after <body> and end it right before </body>, like this:

Code: [ Select ]
<body>
<div id="maintable">

all your content

</div>
</body>
  1. <body>
  2. <div id="maintable">
  3. all your content
  4. </div>
  5. </body>


Then, in your CSS change the 'maintable' class to this:

Code: [ Select ]
#maintable{
      width:760px;
      margin-left:auto;
      margin-right:auto;
      }
  1. #maintable{
  2.       width:760px;
  3.       margin-left:auto;
  4.       margin-right:auto;
  5.       }


The margin thing will center the page for you.

The site looks nice, by the way. Very elegant.
  • ciarac
  • Beginner
  • Beginner
  • User avatar
  • Posts: 48
  • Loc: Spain

Post 3+ Months Ago

Hey, great help from all of you, and 'elegant', you say? Hee, thanks!

Post Information

  • Total Posts in this topic: 7 posts
  • Users browsing this forum: No registered users and 66 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.