Re: Replacing tables with divs

Discussion in 'HTML' started by richard, Mar 8, 2012.

  1. richard

    richard Guest

    On Thu, 8 Mar 2012 00:18:16 +0100, Alfred Molon wrote:

    > There is probably a simple answer to this, but for some reason I haven't
    > figured it out yet.
    >
    > 1. How do I replace a table with three columns with an equivalent div-
    > based code?
    >
    > From:
    > <table>
    > <tr><td></td><td></td><td></td></tr>
    > </table>
    >
    > to:
    > <div>
    > <div id="div1"></div><div id="div2"></div><div id="div3"></div>
    > </div>
    >
    > 2. Same question for a table with three rows:
    >
    > From:
    > <table>
    > <tr><td></td></tr>
    > <tr><td></td></tr>
    > <tr><td></td></tr>
    > </table>
    >
    > to an equivalent code with divs.
    >
    > Should be easily possible with CSS based on what I understood.


    Use <ul> instead.

    <ul style="Display:inline;">
    <li></li><li></li></li>
    </ul>

    This would cause columns to be shown.
    For a new row, just duplicate the three lines.

    For a single column just <div>. Each new division creates the new row
    without styling.
     
    richard, Mar 8, 2012
    #1
    1. Advertising

  2. richard

    Doug Miller Guest

    richard <> wrote in news:1l0zwltn2ti9d$.1ottvsrqvz2og.dlg@
    40tude.net:

    > Use <ul> instead.
    >
    > <ul style="Display:inline;">
    > <li></li><li></li></li>
    > </ul>
    >
    > This would cause columns to be shown.


    No, it doesn't. Did you test this before you posted, RtD?
     
    Doug Miller, Mar 8, 2012
    #2
    1. Advertising

  3. richard

    idle Guest

    On Thu, 8 Mar 2012 11:35:44 +0000 (UTC), Doug Miller wrote in alt.html:

    > richard <> wrote in news:1l0zwltn2ti9d$.1ottvsrqvz2og.dlg@
    > 40tude.net:
    >
    >> Use <ul> instead.
    >>
    >> <ul style="Display:inline;">
    >> <li></li><li></li></li>
    >> </ul>
    >>
    >> This would cause columns to be shown.

    >
    > No, it doesn't. Did you test this before you posted, RtD?


    Course he didn't.
    What a wingnut.

    --
    Mama say, everybody little bit gay.
     
    idle, Mar 8, 2012
    #3
  4. richard

    richard Guest

    On Thu, 8 Mar 2012 11:35:44 +0000 (UTC), Doug Miller wrote:

    > richard <> wrote in news:1l0zwltn2ti9d$.1ottvsrqvz2og.dlg@
    > 40tude.net:
    >
    >> Use <ul> instead.
    >>
    >> <ul style="Display:inline;">
    >> <li></li><li></li></li>
    >> </ul>
    >>
    >> This would cause columns to be shown.

    >
    > No, it doesn't. Did you test this before you posted, RtD?


    http://1littleworld.net/notable.html
     
    richard, Mar 9, 2012
    #4
  5. richard the sto0pid dumbass wrote:

    > Doug Miller wrote:
    >> richard <> wrote:
    >>
    >>> Use <ul> instead.
    >>>
    >>> <ul style="Display:inline;">
    >>> <li></li><li></li></li>
    >>> </ul>
    >>>
    >>> This would cause columns to be shown.

    >>
    >> No, it doesn't. Did you test this before you posted, RtD?

    >
    > http://1littleworld.net/notable.html


    Jeebus! You just *can't* write an error-free page!

    <http://validator.w3.org/check?verbose=1&uri=http://1littleworld.net
    %2Fnotable.html>

    You should just give up web authoring and stick with the kiddie porn and
    mocking the police.

    --
    -bts
    -This space for rent, but the price is high
     
    Beauregard T. Shagnasty, Mar 9, 2012
    #5
  6. richard

    Doug Miller Guest

    richard <> wrote in news:5z1t8a37gugg$.77qu7ceprhzp$.dlg@
    40tude.net:

    > On Thu, 8 Mar 2012 11:35:44 +0000 (UTC), Doug Miller wrote:
    >
    >> richard <> wrote in news:1l0zwltn2ti9d$.1ottvsrqvz2og.dlg@
    >> 40tude.net:
    >>
    >>> Use <ul> instead.
    >>>
    >>> <ul style="Display:inline;">
    >>> <li></li><li></li></li>
    >>> </ul>
    >>>
    >>> This would cause columns to be shown.

    >>
    >> No, it doesn't. Did you test this before you posted, RtD?

    >
    > http://1littleworld.net/notable.html
    >

    Where we do ***NOT*** find "<ul style="Display:inline;">, RtD.

    <Style type="text/css">

    ul li {list-style-type:none; display:inline-block; width:100px; height:100px;
    border:solid 2px #00f; margin:0px;}
    ul {margin:0px;}
    </style>
     
    Doug Miller, Mar 9, 2012
    #6
  7. richard

    richard Guest

    On Fri, 9 Mar 2012 04:25:14 +0000 (UTC), Beauregard T. Shagnasty wrote:

    > richard the sto0pid dumbass wrote:
    >
    >> Doug Miller wrote:
    >>> richard <> wrote:
    >>>
    >>>> Use <ul> instead.
    >>>>
    >>>> <ul style="Display:inline;">
    >>>> <li></li><li></li></li>
    >>>> </ul>
    >>>>
    >>>> This would cause columns to be shown.
    >>>
    >>> No, it doesn't. Did you test this before you posted, RtD?

    >>
    >> http://1littleworld.net/notable.html

    >
    > Jeebus! You just *can't* write an error-free page!
    >
    > <http://validator.w3.org/check?verbose=1&uri=http://1littleworld.net
    > %2Fnotable.html>
    >
    > You should just give up web authoring and stick with the kiddie porn and
    > mocking the police.


    BFD wrong end tags for that document.
    errors fixed.
     
    richard, Mar 12, 2012
    #7
  8. richard

    richard Guest

    On Fri, 9 Mar 2012 11:40:58 +0000 (UTC), Doug Miller wrote:

    > richard <> wrote in news:5z1t8a37gugg$.77qu7ceprhzp$.dlg@
    > 40tude.net:
    >
    >> On Thu, 8 Mar 2012 11:35:44 +0000 (UTC), Doug Miller wrote:
    >>
    >>> richard <> wrote in news:1l0zwltn2ti9d$.1ottvsrqvz2og.dlg@
    >>> 40tude.net:
    >>>
    >>>> Use <ul> instead.
    >>>>
    >>>> <ul style="Display:inline;">
    >>>> <li></li><li></li></li>
    >>>> </ul>
    >>>>
    >>>> This would cause columns to be shown.
    >>>
    >>> No, it doesn't. Did you test this before you posted, RtD?

    >>
    >> http://1littleworld.net/notable.html
    >>

    > Where we do ***NOT*** find "<ul style="Display:inline;">, RtD.
    >
    > <Style type="text/css">
    >
    > ul li {list-style-type:none; display:inline-block; width:100px; height:100px;
    > border:solid 2px #00f; margin:0px;}
    > ul {margin:0px;}
    > </style>


    Correct. Because I wanted to show the two different possible styles.
    In the post to the group, it's a wonder you're not bitching because I used
    the inline styling method as well.
    Or bitching about how come I left out padding in the UL styling.

    Where exactly is your absolutely perfect web site again?
    In the recycle bin?
     
    richard, Mar 12, 2012
    #8
  9. Hot-Text wrote:
    >
    > For UL LI can not be on the same line


    Aside of the fact that *no one* is using that ancient version of
    Netscape that didn't support the STYLE element, UL and LI can ABSOLUTELY
    "be on the same line" in a stylesheet rule. You need to look up
    *descendant selectors*.

    --
    Take care,

    Jonathan
    -------------------
    LITTLE WORKS STUDIO
    http://www.LittleWorksStudio.com
     
    Jonathan N. Little, Mar 12, 2012
    #9
  10. richard

    Doug Miller Guest

    richard <> wrote in news:13zhtajcvp96e.901pysc70k90$.dlg@
    40tude.net:

    > On Fri, 9 Mar 2012 11:40:58 +0000 (UTC), Doug Miller wrote:
    >
    >> richard <> wrote in news:5z1t8a37gugg$.77qu7ceprhzp$.dlg@
    >> 40tude.net:
    >>
    >>> On Thu, 8 Mar 2012 11:35:44 +0000 (UTC), Doug Miller wrote:
    >>>
    >>>> richard <> wrote in news:1l0zwltn2ti9d$.1ottvsrqvz2og.dlg@
    >>>> 40tude.net:
    >>>>
    >>>>> Use <ul> instead.
    >>>>>
    >>>>> <ul style="Display:inline;">
    >>>>> <li></li><li></li></li>
    >>>>> </ul>
    >>>>>
    >>>>> This would cause columns to be shown.
    >>>>
    >>>> No, it doesn't. Did you test this before you posted, RtD?
    >>>
    >>> http://1littleworld.net/notable.html
    >>>

    >> Where we do ***NOT*** find "<ul style="Display:inline;">, RtD.
    >>
    >> <Style type="text/css">
    >>
    >> ul li {list-style-type:none; display:inline-block; width:100px; height:100px;
    >> border:solid 2px #00f; margin:0px;}
    >> ul {margin:0px;}
    >> </style>

    >
    > Correct. Because I wanted to show the two different possible styles.


    Apparently it hasn't sunk into you yet that the first one DOESN'T WORK.

    > In the post to the group, it's a wonder you're not bitching because I used
    > the inline styling method as well.


    No, RtD, I'm bitching because you posted something that DOESN'T WORK.
     
    Doug Miller, Mar 12, 2012
    #10
  11. Hot-Text wrote:
    > "Jonathan N. Little" <> wrote in message
    > news:jjkq74$ctf$...
    >> Hot-Text wrote:
    >>>
    >>> For UL LI can not be on the same line

    >>
    >> Aside of the fact that *no one* is using that ancient version of
    >> Netscape that didn't support the STYLE element, UL and LI can
    >> ABSOLUTELY "be on the same line" in a stylesheet rule. You need to
    >> look up *descendant selectors*.
    >>

    >
    > CSS1 in 1996 that old and not all browser is able to support it today...


    Rubbish. You do not need to use HTML comments around CSS within a STYLE
    element. NN2 is long long dead.

    >
    > LI is not a grandchildren of UL, but a Child thereof..


    Who said otherwise?

    >
    > LI is a grandchildren to TD, Div and more,
    > For UL is the child of TD, Div and more..


    Could be yes, but not the point of your error.

    >
    > You need to look at the family tree for STYLE element..
    >


    family tree?

    >
    > < http://software.visicommedia.com/en/products/acehtml/ >


    What does this have to do with the price of rice in China? Are you a
    salesman or do you rely on a IDE because you do not know HTML?

    <style type="text/css">
    /* this is a perfectly VALID rule */
    ul li { font-size: 8em; }
    </style>

    You need to look up *descendant selectors*, here I will assist you:
    <http://www.w3.org/TR/CSS2/selector.html#descendant-selectors>

    Your inaccurate "advice" does not help newbies.

    --
    Take care,

    Jonathan
    -------------------
    LITTLE WORKS STUDIO
    http://www.LittleWorksStudio.com
     
    Jonathan N. Little, Mar 12, 2012
    #11
  12. Hot-Text wrote:
    > "Jonathan N. Little" <> wrote in message


    <snip>

    >> <style type="text/css">
    >> /* this is a perfectly VALID rule */
    >> ul li { font-size: 8em; }
    >> </style>
    >>
    >> You need to look up *descendant selectors*, here I will assist you:
    >> <http://www.w3.org/TR/CSS2/selector.html#descendant-selectors>
    >>
    >> Your inaccurate "advice" does not help newbies.
    >>

    >
    > ul li { font-size: 8em; } it not a perfectly VALID rule
    > 3 Conformance: Requirements and Recommendations
    >
    > < http://www.w3.org/TR/CSS2/conform.html#replaced-element >
    >


    What? How is that applicable, neither UL nor LI are replaced elements?
    And what does that have to do with have a descendant selectors rule.

    BTW descendant can be a child, grand-child great-grand-child... so this
    is also valid

    UL A { text-decoration: none; }

    <ul>
    <li><a href="http://example.com">Link with NO underline</a></li>
    </ul>



    --
    Take care,

    Jonathan
    -------------------
    LITTLE WORKS STUDIO
    http://www.LittleWorksStudio.com
     
    Jonathan N. Little, Mar 12, 2012
    #12
  13. Hot-Text wrote:
    >
    >
    > "Jonathan N. Little" <> wrote in message
    > news:jjl7dk$u87$...
    >> Hot-Text wrote:
    >>> "Jonathan N. Little" <> wrote in message

    >>
    >> <snip>
    >>
    >>>> <style type="text/css">
    >>>> /* this is a perfectly VALID rule */
    >>>> ul li { font-size: 8em; }
    >>>> </style>
    >>>>
    >>>> You need to look up *descendant selectors*, here I will assist you:
    >>>> <http://www.w3.org/TR/CSS2/selector.html#descendant-selectors>
    >>>>
    >>>> Your inaccurate "advice" does not help newbies.
    >>>>
    >>>
    >>> ul li { font-size: 8em; } it not a perfectly VALID rule
    >>> 3 Conformance: Requirements and Recommendations
    >>>
    >>> < http://www.w3.org/TR/CSS2/conform.html#replaced-element >
    >>>

    >>
    >> What? How is that applicable, neither UL nor LI are replaced elements?
    >> And what does that have to do with have a descendant selectors rule.
    >>

    >
    > read it and you till me...


    "read it and you tell me..."

    I have is has nothing to do with descendant selectors which is obvious
    that you do not understand.

    >
    >>
    >> BTW descendant can be a child, grand-child great-grand-child... so
    >> this is also valid
    >>
    >> UL A { text-decoration: none; }
    >>
    >> <ul>
    >> <li><a href="http://example.com">Link with NO underline</a></li>
    >> </ul>
    >>
    >>

    >
    > Now like that is right a true.......


    Crying "uncle" here, I can not make any sense of you are trying to say
    with that. However, safe to say what you previously stated as "advice"
    about CSS is absolutely incorrect.

    --
    Take care,

    Jonathan
    -------------------
    LITTLE WORKS STUDIO
    http://www.LittleWorksStudio.com
     
    Jonathan N. Little, Mar 14, 2012
    #13
  14. Jonathan N. Little wrote:

    > Hot-Text wrote:
    >> Now like that is right a true.......

    >
    > Crying "uncle" here, I can not make any sense of you are trying to say
    > with that. However, safe to say what you previously stated as "advice"
    > about CSS is absolutely incorrect.


    It's hard to get valid code (or valid spelling, grammar and conversation)
    out of his random word generator.

    --
    -bts
    -This space for rent, but the price is high
     
    Beauregard T. Shagnasty, Mar 14, 2012
    #14
  15. Beauregard T. Shagnasty wrote:

    > It's hard to get valid code (or valid spelling, grammar and conversation)
    > out of his random word generator.


    I think random would be more coherent.

    --
    Take care,

    Jonathan
    -------------------
    LITTLE WORKS STUDIO
    http://www.LittleWorksStudio.com
     
    Jonathan N. Little, Mar 14, 2012
    #15
  16. Hot-Text wrote:

    > Jonathan N. Little wrote:
    >> Beauregard T. Shagnasty wrote:
    >>> It's hard to get valid code (or valid spelling, grammar and
    >>> conversation) out of his random word generator.

    >>
    >> I think random would be more coherent.

    >
    > look like you are unable to comprehend, or grasp the meaning,
    > or understand the nature of something, being it of a conversation
    > questions, in good English grammar lessons,
    > or invalid spelling generator......


    You should upgrade to Generator 2.0 because the one you are using still
    isn't working.

    --
    -bts
    -This space for rent, but the price is high
     
    Beauregard T. Shagnasty, Mar 14, 2012
    #16
    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. rich
    Replies:
    0
    Views:
    724
  2. Gus Richter

    Re: Replacing tables with divs

    Gus Richter, Mar 8, 2012, in forum: HTML
    Replies:
    0
    Views:
    387
    Gus Richter
    Mar 8, 2012
  3. dorayme

    Re: Replacing tables with divs

    dorayme, Mar 8, 2012, in forum: HTML
    Replies:
    15
    Views:
    667
    dorayme
    Mar 11, 2012
  4. idle
    Replies:
    14
    Views:
    836
    richard
    Mar 9, 2012
  5. Jukka K. Korpela

    Re: Replacing tables with divs

    Jukka K. Korpela, Mar 8, 2012, in forum: HTML
    Replies:
    3
    Views:
    1,156
    Beauregard T. Shagnasty
    Mar 8, 2012
Loading...

Share This Page