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

Thread: Tables: cant seperate movement of top rows/columns from bottom ones.

  1. #1
    Join Date
    Mar 2007
    Posts
    14

    Tables: cant seperate movement of top rows/columns from bottom ones.

    my problem is i have a table with like 6 rows and 2 columns. and say the top row in one td has a welcome image, and the next one has my navigation bar.
    then in the next row i merged the two columns together and made one with some text in there. now in the third row, i kept it two columns. now my problem is when i try to move the column divider over more to one side, the top row that i had also moves with it, and it messes up the alignment that i wanted. is there any way to fix this? thank you.

  2. #2
    Join Date
    Mar 2006
    Location
    Newcastle NSW Australia
    Posts
    4,033
    Fix is easy - don't use tables for layout. A bit of semantic content markup, the occasional div for grouping, and a little visual styling is a much easier way to lay out a site than embedding everything in tables.

  3. #3
    Join Date
    Mar 2007
    Posts
    14
    im pretty new to web design/developing so tables is the first/only way i know right now. what is semantic content markup. or where can i learn this way of making pages? thanks for the help

  4. #4
    Join Date
    Jul 2007
    Location
    Cape Town, South Africa
    Posts
    64
    Hi
    What Centauri is suggesting, I think, is that you use CSS (Cascading Style sheets) instead of tables to lay your pages out. I learnt from a CSS book, but you can go to loads of sites - start here:
    http://www.w3schools.com/css/default.asp

    SO to create an HTML page like this is fine:

    <html>
    <body>
    <h1><font color="#990000">This is my heading</font></h1>
    </body>
    </html>

    BUT in terms of modern standards blah blah a more correct method would be to create a stylesheet (a document with the extension .css - so: mystyle.css):

    h1 {color: #990000;}

    and then an HTML page like this:

    <html>
    <head>
    <link rel="stylesheet" href="mystyle.css" />
    </head>
    <body>
    <h1>This is my heading</h1>
    </body>
    </html>

    What we have done is separated the content from the styling - in fact the content is in the HTML doc, and the styling is all in the stylesheet. The benefits of this are infinite!

    However: (and I am ducking the missiles from the purists here) to solve your problem for now using a table, increase the number of columns to give you more flexibility in you layout, or (HORRORS!): nest (insert) one table inside another, or (HORRORS again!) use more than one table - each table having different configurations of rows and columns, but the same width...

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