Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Feb 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Table issues with odd slice sizes (back to basics)

    Hi Everyone, nice to meet you all. I am a new member who decided to buckle down and learn html/css. There's a lot to catch up on! I am starting from the basics and working my way up, which I think is the best approach.

    I have a basic question about tables. If you look in the image below, I have an example of a sliced up image. The problem I run into is when trying to put it together in a table. The odd nature of their arrangement in the lower half leaves massive gaps and is basically a mess. Is this the wrong approach to slicing? In theory I would want to put text in slice 6. The reason for this exercise is to get a better handle on what tables can support.

    http://www.advancedprecision.ca/oddslice.jpg
    Attached Thumbnails Attached Thumbnails Table issues with odd slice sizes (back to basics)-oddslice.jpg  

  • #2
    Regular Coder BoldUlysses's Avatar
    Join Date
    Jan 2008
    Location
    Winston-Salem, NC
    Posts
    938
    Thanks
    10
    Thanked 190 Times in 187 Posts
    Hi shaggyboo,

    Welcome to CF! Kudos for wanting taking the time to learn HTML and CSS.

    You should know, however, that the approach you're taking to page layout--using tables and slicing up your images--is quite outdated and no longer favored by the majority of web designers. If you're using a book or an online tutorial to learn HTML, I'll bet it's probably something at least a few years old.

    The overwhelmingly favored method is semantic (meaningful) HTML and styling/layout with CSS. It separates the content of your page, which is contained in the HTML, from the presentation of your page, done with the CSS. Tables blur the distinction between the two and have many other drawbacks as pointed out in the link above. From a graphic design standpoint, using CSS for layout is a revelation since there's no need to slice up images in the first place. The tutorials here are a good place to start.

    Good luck!
    matt | design | blog

  • #3
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,861
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    If you look in the image below, I have an example of a sliced up image.
    I'd recommend you to just pause there and see "Why tables for layout is stupid?"

    Then have a look at a good CSS based 3 column layout at http://www.bonrouge.com/3c-hf-fluid.php
    Edit: oh.. I'm late
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #4
    New to the CF scene
    Join Date
    Feb 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks for your responses mes amis.

    Your thoughts were most helpful. Basically what I was trying to do was start at the beginning with html and work my way up. I will use w3schools combined with this forum to help me launch into CSS. I do have a pretty good understanding of basic HTML, is this enough to begin getting familiar with CSS? Maybe it's almost better that way since I'll be less likely to use ol HTML tricks.

    So w3 is the best place to start. Thank you. Does anyone have any tutorials of pages that just have the basic single column, centered in the middle of the browser?

    I think I will pick this up quickly. Good to know that there are folks like you around to help me connect the dots from time to time.

    Thanks.

  • #5
    Regular Coder BoldUlysses's Avatar
    Join Date
    Jan 2008
    Location
    Winston-Salem, NC
    Posts
    938
    Thanks
    10
    Thanked 190 Times in 187 Posts
    De rien, mon ami.

    A good understanding of HTML is a great place to start. Just remember: Content goes in the HTML, presentation goes in the CSS. That means even attributes that would traditionally go in HTML tags, like width="40px" or align="center", now go in the CSS instead. Anything deprecated here is a no-no, according to the new paradigm.

    Here is a page of layouts, and this is another great resource.
    matt | design | blog


  •  

    Posting Permissions

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