div instead of table

Discussion in 'HTML & Website Design' started by svanderclock, Mar 10, 2009.

  1. #1
    hello,

    i want to replace my table by div

    the thing i want

    <___the_header___>
    <col1_150px><col2>

    below the begining of my code

    
    <div style="width:50px; border:1px solid #000;">
    	<div style="width:100px;">HEADER</div>
    	<div style="width:10px; float:left;">COL1</div>
    	<div style="float:left;">COL2______________</div>
    </div>
    
    HTML:
    the problem is that COL2 don't stay on the same line of COL1.
    The widh of the main table must be 50px because sometime COL2 can be set to 100% and i don't want the table expend to all the width of the browser.

    in table it's will be easy to do :

    
    <table width="50" border="1">
      <tr>
        <td colspan="2">HEADER</td>
      </tr>
      <tr>
        <td width="10px">COL1</td>
        <td>COL2______________</td>
      <tr>
    <table>
    
    HTML:
    thanks by advance for you help !

    stephane
     
    svanderclock, Mar 10, 2009 IP
  2. Joak1m

    Joak1m Peon

    Messages:
    135
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #2
    The container div is 50 pixels, and two others are 100 and 10, which is 110 pixels total.
    The container must be at least 110 pixels wide then.
     
    Joak1m, Mar 10, 2009 IP
  3. Joak1m

    Joak1m Peon

    Messages:
    135
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Joak1m, Mar 10, 2009 IP
  4. svanderclock

    svanderclock Peon

    Messages:
    17
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    i know, but in the table it's work ok !

    but i write a mistake and i want something like

    <div style="width:50px; border:1px solid #000;">
    <div style="width:100%">HEADER</div>
    <div style="width:10px; float:left;">COL1</div>
    <div style="float:left;">COL2______________</div>
    </div>

    see 100% inplace of 100px

    in fact i simply want to translate

    <table width="50" border="1">
    <tr>
    <td colspan="2">HEADER</td>
    </tr>
    <tr>
    <td width="10px">COL1</td>
    <td>COL2______________</td>
    <tr>
    <table>

    in div !

    thanks again
    stephane
     
    svanderclock, Mar 10, 2009 IP
  5. Lpe04

    Lpe04 Peon

    Messages:
    579
    Likes Received:
    15
    Best Answers:
    0
    Trophy Points:
    0
    #5
    Set col2 to a set width if you don't want it to expand to far, that's what I would do.
     
    Lpe04, Mar 10, 2009 IP
  6. Lpe04

    Lpe04 Peon

    Messages:
    579
    Likes Received:
    15
    Best Answers:
    0
    Trophy Points:
    0
    #6
    sorry, looking at your new code, I think you need to set col2 to a width, wheter it is percentage or pixel or it will always bump down. If you don't set a width it will just try to expand to 100% everytime and bump down. Let me know if this works.

    Lance
     
    Lpe04, Mar 10, 2009 IP
  7. svanderclock

    svanderclock Peon

    Messages:
    17
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #7
    yes, but in fact i can not set a width to col2 as it's depend of it's content.

    in fact, i simply want to transform in div this :

    <table width="50" border="1">
    <tr>
    <td colspan="2">HEADER</td>
    </tr>
    <tr>
    <td width="10px">COL1</td>
    <td>COL2______________</td>
    <tr>
    <table>

    stephane
     
    svanderclock, Mar 10, 2009 IP
  8. kazkas

    kazkas Peon

    Messages:
    12
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #8
    Does
    is what you try to achieve?
     
    kazkas, Mar 11, 2009 IP