...

View Full Version : Portfolio Information... HTML Tables? or CSS Div tags?



commandercup
03-12-2009, 02:22 AM
So... if I plan on making a little portfolio page with text on the left side cells and pictures of the sites/work on the right side cells... should I be using HTML tables or CSS div tags?

Ie.

TEXT DESCRIBING PROJECT HERE | IMAGE HERE
TEXT DESCRIBING PROJECT HERE | IMAGE HERE
TEXT DESCRIBING PROJECT HERE | IMAGE HERE
TEXT DESCRIBING PROJECT HERE | IMAGE HERE

^Ghetto rendition

VIPStephan
03-12-2009, 02:41 AM
You may go best with a list but divisions are fine. Of course a table is not what you should use because it’s not really tabular data.

mwgriffin
03-12-2009, 02:47 AM
I would definitely use css, and html, and some sort of ajax script (if you want it to look good and interact well. css should be used to design the page, html to create the table with the information, and perhaps an ajax widget to make interaction easy(could use spry). I would recommend searching for spry on google, downloading the package and checking out what it could do for you. Here's my website I'm working on that uses css, spry and external html files. the css is present in an external file which determines the look and layout of the website (this is absolutely great as you can make changes in the single file and have it affect all of the pages you have it linked to). The spry is used for the menu and loading the external html pages (great because I can change things in those files without having to deal with any of the code of the website layout, just the modify the content) into the div tag. here's my website: http://www.mwgriffin.com

BoldUlysses
03-12-2009, 02:48 AM
I would actually do it as an unordered list, seeing as how that's what it really is. It's not strictly tabular data so tables aren't appropriate, and they bloat the markup, and divs would work, but a list is more semantic:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"/>
<title>Untitled Page</title>

<style type="text/css">

ul {
font:1em/40px arial, verdana, sans-serif;
padding:0;
list-style-type:none;
}

li {
display:block;
height:40px;
border:1px solid #f00;
}

img {
display:block;
float:left;
background:#0f0;
margin-right:10px;
}

</style>

</head>

<body>

<ul>
<li><img src="image1.jpg" alt="Project 1 Thumbnail" title="" />Project 1 description goes here.</li>
<li><img src="image2.jpg" alt="Project 2 Thumbnail" title="" />Project 2 description goes here.</li>
<li><img src="image3.jpg" alt="Project 3 Thumbnail" title="" />Project 3 description goes here.</li>
<li><img src="image4.jpg" alt="Project 4 Thumbnail" title="" />Project 4 description goes here.</li>
<li><img src="image5.jpg" alt="Project 5 Thumbnail" title="" />Project 5 description goes here.</li>
</ul>

</body>
</html>

commandercup
03-12-2009, 02:59 AM
hmmm, I guess I'll experiment with lists! Thanks



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum