Using .CSS files

mike55

Contributor
Joined
Mar 26, 2004
Messages
727
Location
Ireland
Hi all

First question: when setting the style of a piece of text to a .CSS class, I am currently enclosing that text in a <span> tag, however, someone suggested that I should use the <div> tag instead. Any comments??

Second question: I'm trying to use the <span class="controls"></span> to set the font-style and font-size of asp.net textboxes, however the style does not seem to apply. if I use the same class on a asp.net menu, it works correctly. Any reason why??

Mike55.
 
From what I understand, the only significant difference between a Span and a Div is that a Div is a block-level element, whereas a Span will have no effect on layout whatsoever. If you put <span> tags around one sentence in a paragraph, the only effect it will have is the formatting from your CSS. If you put a <div> tag instead, that sentence will be displayed as a separate paragraph.
 
mike55 said:
Hi all

First question: when setting the style of a piece of text to a .CSS class, I am currently enclosing that text in a <span> tag, however, someone suggested that I should use the <div> tag instead. Any comments??

Second question: I'm trying to use the <span class="controls"></span> to set the font-style and font-size of asp.net textboxes, however the style does not seem to apply. if I use the same class on a asp.net menu, it works correctly. Any reason why??

Mike55.

Try using the CssClass property of the ASP TextBox control:

Code:
<ASP:TextBox ID="Text1" CssClass="controls" RunAt="server" />

As for <span> vs <div>, I use <div> to format general sections of my pages, and <span> for more specific fine-tuning (mostly of short text segments). For example:

Code:
<html>
  <head>
    <title>Book List</title>
    <style type="text/css">
      .divBookList {
        margin: 10px;
        border: 1px solid #000;
        background-color: #ccf;
        width: 500px;
        padding: 10px;
      }
      .divBook {
        font-family: Arial, sans-serif;
        font-size: 12pt;
        margin: 5px 0;
        padding: 2px 5px;
        color: #000;
        background-color: #fff;
      }
      .spanBookTitle {
        font-weight: bold;
        text-decoration: underline;
      }
      .spanBookAuthor {
        font-style: italic;
        color: #c00;
      }
    </style>
  </head>
  <body>

  <div class="divBookList">
    <div class="divBook">
      <span class="spanBookTitle">Some Book</span>,
      by <span class="spanBookAuthor">Some Author</span>
    </div>
  </div>

  </body>
</html>
 
Back
Top