Professional Web Applications Themes

how to replace table with div tag..? - HTML & CSS

anyone know how can I replace this code using only the div tag? I have tried everything but I can't do it. here's the code using table: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; cht=iso-8859-1"> <title>Untitled Doent</title> </head> <body> <table width="799" align="center" style="border:1px solid #999999"> <tr> <td><div id="sidebar" style="border:1px solid #999999; width: 160px; float:left"> <h2>sidebar</h2> <ul id="nav"> <li><a href="#">Test Link One</a></li> <li><a href="#">Test Link Two</a></li> <li><a href="#">Test Link Three</a></li> <li><a href="#">Test Link Four</a></li> <li><a href="#">Test Link Five</a></li> </ul> <p>Additional sidebar content.</p></div> <div id="maincontent" style="border:1px solid #999999; margin:0 0 0 2px; float:left"> <h2>main content</h2> <p>Testing</p> ...

  1. #1

    Default how to replace table with div tag..?

    anyone know how can I replace this code using only the div tag? I have
    tried everything but I can't do it.

    here's the code using table:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html;
    cht=iso-8859-1">
    <title>Untitled Doent</title>
    </head>

    <body>
    <table width="799" align="center" style="border:1px solid #999999">
    <tr>
    <td><div id="sidebar" style="border:1px solid #999999; width:
    160px; float:left">
    <h2>sidebar</h2>
    <ul id="nav">
    <li><a href="#">Test Link One</a></li>
    <li><a href="#">Test Link Two</a></li>
    <li><a href="#">Test Link Three</a></li>
    <li><a href="#">Test Link Four</a></li>
    <li><a href="#">Test Link Five</a></li>
    </ul>
    <p>Additional sidebar content.</p></div>

    <div id="maincontent" style="border:1px solid #999999; margin:0 0 0
    2px; float:left">
    <h2>main content</h2>
    <p>Testing</p>
    </div></td>
    </tr>
    </table>
    </body>
    </html>

    thanks for any help
    jaYPee Guest

  2. #2

    Default Re: how to replace table with div tag..?

    With neither quill nor qualm, jaYPee quothed:
    > anyone know how can I replace this code using only the div tag? I have
    > tried everything but I can't do it.
    <snip>

    What's not working with the div?

    --
    Neredbojias
    Contrary to popular belief, it is believable.
    Neredbojias Guest

  3. #3

    Default Re: how to replace table with div tag..?

    jaYPee wrote:
    > anyone know how can I replace this code using only the div tag?
    Here you are:

    <div>

    --
    Toby A Inkster BSc (Hons) ARCS
    Contact Me ~ [url]http://tobyinkster.co.uk/contact[/url]

    Toby Inkster Guest

  4. #4

    Default Re: how to replace table with div tag..?

    With neither quill nor qualm, Toby Inkster quothed:
    > jaYPee wrote:
    >
    > > anyone know how can I replace this code using only the div tag?
    >
    > Here you are:
    >
    > <div>
    How uncharacteristically thoughtless of you! You forgot to close the
    tag (</div>).

    --
    Neredbojias
    Contrary to popular belief, it is believable.
    Neredbojias Guest

  5. #5

    Default Re: how to replace table with div tag..?

    tada...
    here it is, but there's a bit of a problem with firefox, the
    all-encompassing div seems to be squashed at the top, no time to figure
    out why right now - probably something simple that i've overlooked

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html;
    cht=iso-8859-1">
    <title>Untitled Doent</title>
    <style type="text/css">
    div{
    border:1px solid #999999;
    }
    body div{
    width:799px;
    margin: auto;
    padding:2px;
    }
    div#sidebar{
    width: 160px;
    float:left;
    }
    div#maincontent{
    margin:0 0 0 2px;
    width: auto; /*or 799-160=639 to take up all the available area*/
    float:left; /*or leave width:auto and remove float:left*/
    }
    </style>
    </head>


    <body>
    <div>
    <div id="sidebar">
    <h2>sidebar</h2>
    <ul id="nav">
    <li><a href="#">Test Link One</a></li>
    <li><a href="#">Test Link Two</a></li>
    <li><a href="#">Test Link Three</a></li>
    <li><a href="#">Test Link Four</a></li>
    <li><a href="#">Test Link Five</a></li>
    </ul>
    <p>Additional sidebar content.</p>
    </div>
    <div id="maincontent">
    <h2>main content</h2>
    <p>Testing</p>
    </div>
    </div>
    </body>
    </html>

    Dima Gofman Guest

Similar Threads

  1. help with the replace(pattern, replace)
    By Cloudesk in forum Macromedia Flex General Discussion
    Replies: 0
    Last Post: April 24th, 03:22 PM
  2. Search and replace (super global replace)
    By johnweiffenbach@adobeforums.com in forum Adobe Acrobat Windows
    Replies: 1
    Last Post: April 8th, 08:56 AM
  3. Replies: 0
    Last Post: September 16th, 04:37 PM
  4. Replies: 0
    Last Post: September 10th, 10:49 PM
  5. Replies: 2
    Last Post: August 12th, 07:55 AM

Bookmarks

Posting Permissions

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

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139