#1
  1. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    May 2001
    Location
    Switzerland
    Posts
    64
    Rep Power
    14

    CSS - What is good style?


    In another thread, I read about mixing font tags and CSS, especially that this is considered messy.

    My problem is that, so far, I did not manage to create a pure CSS layout that was really accurate to the single pixel afterwards. Example: I was not able to specify the exact indent after a header tag, <h1> etc, such as that it looked the same in all popular browsers. Moreover, I had different blocks of "plain text" that had to be displayed differently (article text, comment text, etc). That is, I still needed some markup for these text blocks in order to assign them a specific layout.

    A solution which I found rather elegant was using different CSS classes:

    Code:
    <!-- css -->
    .title {font-weight: bold; font-size: 16pt; margin-bottom: 10px}
    .text {font-size: 11pt}
    ..
    
    <!-- body -->
    <font class="title">My title</font>
    <font class="text">Blah, blah</font>
    Using these font tags, I still have all my layout definitions in one single file. Clean, isn't it? Or had I rather use <div> tags?
    And still, I wonder if I have misunderstood the CSS concept.

    Any opinions? I'd really like to discuss this and hear what some CSS-experienced people have to say.
  2. #2
  3. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2001
    Location
    New York
    Posts
    122
    Rep Power
    14
    reptile:

    Four points:
    1. defining your own classes is the way to go. You can also associate style definitions with element id's using the '#' symbol. For example,
    #title {font-weight: bold; font-size: 16pt; margin-bottom: 10px}
    Would style an element with the id of "title" rather than "class".

    2. Browser support for things like indents, line-heights, etc. is very poor, so don't be too worried - we're all suffering under the same limitations.

    3. As you have guessed, you should be using <span>, <div>, and <p> tags rather than <font> tags.

    4. It seems like you have a pretty firm grasp of the css concept.

    Good luck
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    May 2001
    Location
    Switzerland
    Posts
    64
    Rep Power
    14
    Thanks, this is reassuring .
    I will eliminate my font tags one by one, then.

IMN logo majestic logo threadwatch logo seochat tools logo