CSS - Formatting text

Discussion in 'HTML' started by david.hunter@gmail.com, Apr 10, 2006.

  1. Guest

    Hi All - I have a list of words that I would like to place into three
    'columns', left justfied so that the word in each column 'lines up'. In
    tables I would simply use mutiple rows, three columns.

    How can I do this using CSS ?" I don't know how to congtrol the spacing
    between each word.

    I am refering to the left hand column in this page under Songs :
    http://unchained.ca/songs/index.php?menu=songs

    I wuold like to be able to fomrat the look of thes text so it is not
    so unorganized :
    Listen - Lyrics - song name
    Listen - Lyrics - song name
    Listen - Lyrics - song name
    Listen - Lyrics - song name
    Listen - Lyrics - song name

    Thanks!
    , Apr 10, 2006
    #1
    1. Advertising

  2. JDS Guest

    On Mon, 10 Apr 2006 07:45:21 -0700, david.hunter wrote:

    > Hi All - I have a list of words that I would like to place into three
    > 'columns', left justfied so that the word in each column 'lines up'. In
    > tables I would simply use mutiple rows, three columns.
    >
    > How can I do this using CSS ?" I don't know how to congtrol the spacing
    > between each word.
    >
    > I am refering to the left hand column in this page under Songs :
    > http://unchained.ca/songs/index.php?menu=songs
    >
    > I wuold like to be able to fomrat the look of thes text so it is not
    > so unorganized :
    > Listen - Lyrics - song name
    > Listen - Lyrics - song name
    > Listen - Lyrics - song name
    > Listen - Lyrics - song name
    > Listen - Lyrics - song name
    >
    > Thanks!


    Use tables just for this list. IMO, this is a valid "use tables"
    situation.

    --
    JDS | lid
    | http://www.newtnotes.com
    DJMBS | http://newtnotes.com/doctor-jeff-master-brainsurgeon/
    JDS, Apr 10, 2006
    #2
    1. Advertising

  3. Guest

    LOL. Ok - thanks for the input.

    I was trying to increase my knowledge of css in this area - but if this
    is the 'industry norm' in this case then that's fine by me. :)
    , Apr 10, 2006
    #3
  4. a écrit :

    > Hi All - I have a list of words that I would like to place into three
    > 'columns', left justfied so that the word in each column 'lines up'.
    > In tables I would simply use mutiple rows, three columns.


    A TABLE would be okay actually, but there are better alternatives (see
    below).

    > http://unchained.ca/songs/index.php?menu=songs
    >
    > I wuold like to be able to fomrat the look of thes text so it is not
    > so unorganized :
    > Listen - Lyrics - song name
    > Listen - Lyrics - song name
    > Listen - Lyrics - song name
    > Listen - Lyrics - song name
    > Listen - Lyrics - song name


    If you are to use a ragged left (right flushed) style, you'd better
    put the fixed length text on the right, and leave the variable song
    name on the left:

    song name: track, lyrics
    long song name: track, lyrics
    shortest song name: track, lyrics

    and so on. For this you don't even need a table.

    Note that the current transitional XHTML DIV soup does not validate.
    Among other suggestions: use a list (UL or OL) to markup the tracklist
    (in fact much better than a TABLE, IMHO), do not reuse the same id
    several times, set a background color, ...

    --
    Daniel Déchelotte
    http://yo.dan.free.fr/
    Daniel =?ISO-8859-15?Q?D=E9chelotte?=, Apr 10, 2006
    #4
  5. JDS Guest

    On Mon, 10 Apr 2006 07:56:36 -0700, david.hunter wrote:

    > is the 'industry norm' in this case then that's fine by me. :)


    Hmm... "industry norm" seems to me like a weird way to describe this
    situation.

    A "table" is for tabular data.

    One could, perhaps, argue, that yes, in fact, your track list *is* tabular
    data. (One could also argue against that point, I think).

    Thus the suggestion, "use a table."


    However, I like D Déchelotte's suggestion of using a right-justified
    list better.


    Overall, the point is this:

    When using CSS, remember that the HTML is for "MARKUP" and the CSS is for
    "LAYOUT". Use the most closely correct HTML markup for each item on a
    page. If a thing is a "list" then use <UL> or <OL> with <LI> for the list
    items. If a thing is a pargraph, then mark it as such (<p>). And so on.
    So if a thing is a table of information that only makes sense when laid
    out in rows and columns that relate back to the row and column headings,
    then use a <TABLE>. Otherwise, it is probably just a list.

    This is called "semantically correct markup".

    In actuality, as I look back at your page, (and I see now that you have
    tweaked the layout since you posted), the list of tracks is really just a
    list and <UL> (or maybe <OL>) is probably more semantically correct. So I
    retract my earlier "use a table" suggestion as it is semantically
    incorrect.


    The best[1] way for you to do this is really to use a list, and then use
    CSS tabular layout to lay out the columns. But CSS tables do not work
    *at* *all* in a particular browser whose name I withhold (<Cough cough
    MSIE cough>) and thus your layout will not work for most of your viewing
    audience.

    later..




    [1] In all things computer related, there is always another "best" way to
    do something. So take the word "best" with a grain of salt here.

    --
    JDS | lid
    | http://www.newtnotes.com
    DJMBS | http://newtnotes.com/doctor-jeff-master-brainsurgeon/
    JDS, Apr 10, 2006
    #5
  6. On Mon, 10 Apr 2006, JDS wrote:

    > When using CSS, remember that the HTML is for "MARKUP" and the CSS
    > is for "LAYOUT".


    Well, for "presentation". "Layout" is only a part of presentation.

    Indeed, for some kinds of presentation (e.g speaking browser) the
    concept of "layout" is somewhat tenuous.
    Alan J. Flavell, Apr 10, 2006
    #6
  7. JDS Guest

    JDS, Apr 10, 2006
    #7
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Replies:
    0
    Views:
    748
  2. Brian Tozer

    Text formatting CSS query

    Brian Tozer, Oct 3, 2003, in forum: HTML
    Replies:
    7
    Views:
    493
    brucie
    Oct 3, 2003
  3. Peter Charles
    Replies:
    12
    Views:
    1,131
    Lauri Raittila
    Jan 24, 2004
  4. mark | r

    css formatting legend

    mark | r, Jan 30, 2004, in forum: HTML
    Replies:
    5
    Views:
    11,594
    mark | r
    Feb 2, 2004
  5. Noozer

    CSS formatting questions...

    Noozer, Sep 30, 2004, in forum: HTML
    Replies:
    6
    Views:
    439
Loading...

Share This Page