dcsimg
www.webdeveloper.com
Results 1 to 8 of 8

Thread: Table

  1. #1
    Join Date
    Feb 2006
    Posts
    11

    Table

    Hi guys;
    i'm amateur in html :-", take a look at attached image,
    how can i make a page like this using tables!?

    thanks
    Attached Images Attached Images

  2. #2
    Join Date
    Nov 2003
    Location
    Jerryville, Tejas
    Posts
    11,715
    You'd be a fool to try IMHO. That's a simple two column CSS layout. Forget the tables.

  3. #3
    Join Date
    Oct 2005
    Posts
    843
    (tables are frowned on when designing sites as that isnt their function, css should be used which is what it was design for)

  4. #4
    Join Date
    Nov 2004
    Location
    Barbados - West Indies
    Posts
    212
    You guys are STILL not offering solutions to the problem.

    I have done this several times using tables and the result is what I want. Its efficient and works well. CSS is an alternative, but if you know how to use Tables, then stick with what you know...

  5. #5
    Join Date
    Oct 2005
    Posts
    843
    if you have used tables several times over why arent you offering a solution? Also tables shouldnt be an alternative too css, if anything it should be the otherway around. try this:
    HTML Code:
    <body style="margin-left: 5px; margin-top: 5px;">
    <table width="400px" height="600px" border="1" cellpadding="0" cellspacing="0">
      <tr>
        <td height="100px">&nbsp;</td>
      </tr>
      <tr>
        <td height="50px">&nbsp;</td>
      </tr>
      <tr>
        <td height="400px">&nbsp;</td>
      </tr>
      <tr>
        <td height="50px">&nbsp;</td>
      </tr>
    </table>
    <table width="400px" height="600px" border="1" cellpadding="0" cellspacing="0" style="position:absolute; left:405px; top:5px">
      <tr>
        <td height="110px">&nbsp;</td>
      </tr>
      <tr>
        <td height="50px">&nbsp;</td>
      </tr>
      <tr>
        <td height="40px">&nbsp;</td>
      </tr>
      <tr>
        <td height="400px">&nbsp;</td>
      </tr>
      <tr>
    </table>
    </body>

  6. #6
    Join Date
    Nov 2003
    Location
    Jerryville, Tejas
    Posts
    11,715
    You guys are STILL not offering solutions to the problem.
    The philosophical question is whether to help someone do something stupid.

  7. #7
    Join Date
    Jun 2004
    Location
    England
    Posts
    2,972
    Or to offer them a solution to thier problem:
    HTML Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
    <html>
      <head>
        <title></title>
    <style type="text/css">
    <!--
    body{
    margin: 0;
    padding: 0 20%;
    font: 12px sans;
    }
    div.col{
    width: 40%;
    float: left;
    background-color: #ccc;
    border-left: 1px solid #000;
    }
    div.semi{
    border-bottom: 1px solid #000;
    padding: 10px;
    }
    -->
    </style>
      </head>
      <body>
        <div class="col">
          <div class="semi">
            <p>
              Lorem ipsum dolor sit amet, consectetuer adipiscing
              elit. Fusce sit amet lacus. Aliquam rhoncus, nisl vel
              facilisis feugiat, purus nisi ultrices sapien, a ornare
              erat justo sed mi.
            </p>
            <p>
              Proin quis mi ut est convallis varius. <em style=
              "color: red;">Phasellus vel massa at tellus lobortis
              pretium.</em> Praesent commodo congue dolor. Mauris at
              purus. Nulla facilisi. In hac habitasse platea
              dictumst.
            </p>
            <p>
              Vestibulum bibendum libero at magna. Sed et augue ac
              metus ullamcorper rutrum. Integer ut arcu. In rhoncus
              massa ac quam. Curabitur augue sapien, sodales nec,
              congue nec, luctus vitae, nisl. Nunc malesuada diam ut
              lectus.
            </p>
            <p>
              Morbi cursus, mauris non fermentum porta, nibh eros
              blandit mauris, pharetra sollicitudin erat nisl nec
              neque.
            </p>
          </div>
          <div class="semi">
            <p>
              Sed viverra quam et mi. Fusce nisl. <strike>Maecenas
              purus.</strike> Etiam adipiscing libero quis nisl. Duis
              pharetra justo ac nunc. Proin sit amet felis. Nulla
              aliquet. Sed ligula urna, vulputate et, placerat vel,
              porttitor nec, est. *** sociis natoque penatibus et
              magnis dis parturient montes, nascetur ridiculus mus.
              Mauris cursus justo at felis consequat molestie.
            </p>
            <p>
              Vestibulum quis tortor.
            </p>
            <p>
              Aliquam tincidunt. Sed tempus molestie massa. Aenean
              interdum. Curabitur commodo ullamcorper ante. Integer
              vulputate nisi in nisl. In hac habitasse platea
              dictumst. Pellentesque posuere. Nullam rutrum tincidunt
              metus. Praesent condimentum.
            </p>
            <p>
              Nam quis lacus non lorem tempus pharetra. Duis euismod
              tortor vel velit. Phasellus quis velit ac ligula
              bibendum porta. Proin malesuada nibh vel sem.
              Pellentesque malesuada. Morbi ultrices ipsum id tortor.
              Aenean tempus, lectus id congue aliquet, erat arcu
              molestie nunc, vel viverra nulla magna non ipsum.
            </p>
          </div>
        </div>
        <div class="col">
          <div class="semi">
            <ul>
              <li>One
              </li>
              <li>Two
              </li>
              <li>Three
              </li>
            </ul>
          </div>
          <div class="semi">
            <p>
              Sed viverra quam et mi. Fusce nisl. Maecenas purus.
              Etiam adipiscing libero quis nisl. Duis pharetra justo
              ac nunc. Proin sit amet felis. Nulla aliquet. Sed
              ligula urna, vulputate et, placerat vel, porttitor nec,
              est. *** sociis natoque penatibus et magnis dis
              parturient montes, nascetur ridiculus mus. Mauris
              cursus justo at felis consequat molestie.
            </p>
            <pre>
    <code>Vestibulum{
       quis tortor('Aliquam',$tincidunt);
       }</code>
    </pre>
            <p>
              Sed tempus molestie massa. Aenean interdum. Curabitur
              commodo ullamcorper ante. Integer vulputate nisi in
              nisl. In hac habitasse platea dictumst. Pellentesque
              posuere. Nullam rutrum tincidunt metus. Praesent
              condimentum.
            </p>
            <p>
              Nam quis lacus non lorem tempus pharetra. <strong>Duis
              euismod tortor vel velit.</strong> Phasellus quis velit
              ac ligula bibendum porta. Proin malesuada nibh vel sem.
              Pellentesque malesuada. Morbi ultrices ipsum id tortor.
              Aenean tempus, lectus id congue aliquet, erat arcu
              molestie nunc, vel viverra nulla magna non ipsum.
            </p>
          </div>
        </div>
      </body>
    </html>

  8. #8
    Join Date
    Feb 2006
    Posts
    11
    thanks guys

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles