11 {{ upvoteCount | shortNum }}
11 {{ upvoteCount | shortNum }}

Creating my tables

by Vulk
10 replies
  • WEB DESIGN
    • |
Hey WF

If there's one thing I hate the most it's creating tables, I've always had trouble creating them cause they always come out looking like garbage.
So I thought, maybe someone else could help me...

my current website layout looks like this but without the tables in the content area

http://i55.tinypic.com/3089sg2.png

I'd like to have tables exactly like that, multiple rows.
If someone could point me in the right direction I'd be more than grateful.
#creating #tables
  • Profile picture of the author phpbbxpert
    I do not see anything in that image that needs to be tables.
    Tables should only be used for tabular data.

    That entire web page and content showing should be divs
    If the picture boxes are just that pictures, then they don't need to be anything other than an img tag with maybe a class for styling, they will float on their own usually because they are inline data by default.
    {{ DiscussionBoard.errors[2813711].message }}
    • Profile picture of the author mojojuju
      Originally Posted by phpbbxpert View Post


      Tables should only be used for tabular data.
      Bah. That's the talk of elitist CSS purists, and which has been parroted endlessly. For most purposes, it's not going to cause a problem if a table is used to display some images. It's not going to break the internet if tables are used for non tabular information.
      Signature

      :)

      {{ DiscussionBoard.errors[2814071].message }}
      • Profile picture of the author phpbbxpert
        Originally Posted by mojojuju View Post

        Bah. That's the talk of elitist CSS purists, and which has been parroted endlessly. For most purposes, it's not going to cause a problem if a table is used to display some images. It's not going to break the internet if tables are used for non tabular information.
        Would you eat a steak with a spoon or sail a car across a lake?
        No, because it's neither proper or correct.

        It has nothing to do with CSS purists, it is about the proper way of doing things, in this case, coding and coding standards.

        Also if its just images eg(pictures) we are talking about there is no point in adding extra markup that is not needed eg. tables.

        Images float on their own because they are inline elements.
        They just need a little CSS for spacing them out, a simple class.
        {{ DiscussionBoard.errors[2814271].message }}
        • Profile picture of the author mojojuju
          Originally Posted by phpbbxpert View Post

          Would you eat a steak with a spoon or sail a car across a lake?
          No, because it's neither proper or correct.
          No, because spoons are not effective for eating steak, and cars are not effective for sailing.

          Tables are effective in displaying images in rows and columns.
          Signature

          :)

          {{ DiscussionBoard.errors[2814461].message }}
        • Profile picture of the author Ambius
          Originally Posted by phpbbxpert View Post

          Would you eat a steak with a spoon or sail a car across a lake?
          No, because it's neither proper or correct.

          It has nothing to do with CSS purists, it is about the proper way of doing things, in this case, coding and coding standards.
          1) worst analogy ever. enough said.

          2) show me the standard that states I must use divs to show pictures in a grid layout? or any layout, for that matter.
          {{ DiscussionBoard.errors[2816323].message }}
      • Profile picture of the author chapdaddy
        Originally Posted by mojojuju View Post

        Bah. That's the talk of elitist CSS purists, and which has been parroted endlessly. For most purposes, it's not going to cause a problem if a table is used to display some images. It's not going to break the internet if tables are used for non tabular information.
        no... tables do a crap job of formatting a page. If you want to reposition an element with a div, you simply change it's attributes... if it's hedged into a table it becomes more complicated and if it's a nested table you are going to waste 10X as much time making edits. I developed with tables back in the day and once I found out how powerful divs were I couldn't believe how much time I wasted debugging tables.
        {{ DiscussionBoard.errors[2818524].message }}
  • Profile picture of the author phpbbxpert
    I can see tables as a valid solution for making a gallery.

    Myself I would still use div's, its cleaner and less makeup. Also note, most galleries do the same.

    By the time you get done adding the styling and attributes to the table elements it will be even more markup, than this example.
    <table>
    <tr>
    <td><img src="" alt="" /></td>
    <td><img src="" alt="" /></td>
    <td><img src="" alt="" /></td>
    </tr>
    <tr>
    <td><img src="" alt="" /></td>
    <td><img src="" alt="" /></td>
    <td><img src="" alt="" /></td>
    </tr>
    </table>

    Could just as well be
    <div class="g-row">
    <img class="g-image" src="" alt="" />
    <img class="g-image" src="" alt="" />
    <img class="g-image" src="" alt="" />
    </div>
    <div class="g-row">
    <img class="g-image" src="" alt="" />
    <img class="g-image" src="" alt="" />
    <img class="g-image" src="" alt="" />
    </div>


    From here the Op can do what they want.
    {{ DiscussionBoard.errors[2814574].message }}
    • Profile picture of the author Vulk
      Originally Posted by phpbbxpert View Post

      I can see tables as a valid solution for making a gallery.

      Myself I would still use div's, its cleaner and less makeup. Also note, most galleries do the same.

      By the time you get done adding the styling and attributes to the table elements it will be even more markup, than this example.
      <table>
      <tr>
      <td><img src="" alt="" /></td>
      <td><img src="" alt="" /></td>
      <td><img src="" alt="" /></td>
      </tr>
      <tr>
      <td><img src="" alt="" /></td>
      <td><img src="" alt="" /></td>
      <td><img src="" alt="" /></td>
      </tr>
      </table>

      Could just as well be
      <div class="g-row">
      <img class="g-image" src="" alt="" />
      <img class="g-image" src="" alt="" />
      <img class="g-image" src="" alt="" />
      </div>
      <div class="g-row">
      <img class="g-image" src="" alt="" />
      <img class="g-image" src="" alt="" />
      <img class="g-image" src="" alt="" />
      </div>


      From here the Op can do what they want.


      Thank you very much! worked perfectly.
      {{ DiscussionBoard.errors[2817579].message }}
  • Profile picture of the author tekboi
    I learned a while back that using tables suck. Even though your local college professor will teach you otherwise. Just use Div's as the guy above stated.
    {{ DiscussionBoard.errors[2818213].message }}
  • Profile picture of the author kathiemt
    I use tables all the time but it really does depend on the width of your site and the images. Is it a fixed width or a percentage? Could display differently depending on what size monitor is being viewed.
    {{ DiscussionBoard.errors[2818228].message }}

Trending Topics