Topic: Table hack to CSS Pages that link to <a href="https://ozoneasylum.com/backlink?for=22213" title="Pages that link to Topic: Table hack to CSS" rel="nofollow" >Topic: Table hack to CSS\

 
Author Thread
Radical Rob
Bipolar (III) Inmate

From: Kapolei, Hawaii USA
Insane since: Jun 2001

IP logged posted posted 06-17-2004 02:30 Edit Quote

OK I've been working with CSS for a little while trying to grasp all the finer points but was forced to piece together really quick as a demo of what a site will look like.

Any simple suggestions of ways to convert completely to CSS... I know everyone hates these table hacked sites but it was the best I could do under such short notice.

Also, any critiques on the colors, layout, etc. would be greatly appreciated. I haven't built anything else besides what you see so I want to get my feedback before I put to much work into it.

thanks

oops... here's the site http://www.hvug.com



(Edited by Radical Rob on 06-17-2004 02:30)

Tyberius Prime
Paranoid (IV) Mad Scientist with Finglongers

From: Germany
Insane since: Sep 2001

IP logged posted posted 06-17-2004 08:15 Edit Quote

you know... that looks really like a mostly empty page on 1280x1024 pixels... and I have to scroll even to see the dummy content. Argh.

Radical Rob
Bipolar (III) Inmate

From: Kapolei, Hawaii USA
Insane since: Jun 2001

IP logged posted posted 06-17-2004 11:55 Edit Quote

Suggestion? I was trying to keep it simple, plain and when content arrives, informative.
I'm totally open to suggestions.

WarMage
Maniac (V) Mad Scientist

From: Rochester, New York, USA
Insane since: May 2000

IP logged posted posted 06-17-2004 16:24 Edit Quote

Don't load it into a frame. I don't see how you did the CSS for layout. If you want to get into doing CSS layouts just forget the table exists. Start with a blank template file (use XHTML)

code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>The Page's Title</title>
<style type="text/css" media="all">
body{

}

#head{

}

#menu{

}

#content{

}

#foot{

}
</style>
</head>
<body>
<div id="head"><h1>Page's Title Area</h1></div>

<div id="menu">
<ul>
<li><a rel="nofollow" href="#">Item 1</a></li>
<li><a rel="nofollow" href="#">Item 2</a></li>
</ul>
</div>

<div id="content">
<h1>Content</h1>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc ornare orci ac
magna mattis tincidunt. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Maecenas non libero. Suspendisse potenti. Nullam tincidunt nisl et lectus. Quisque
posuere. Suspendisse dapibus dignissim risus. Donec quis ante mollis magna
posuere porttitor. Sed massa lorem, porta ut, eleifend id, placerat id, mauris. Duis
facilisis nisl. Nulla sagittis, sapien at convallis molestie, ligula felis viverra turpis, eu
malesuada nisl arcu a odio. Aliquam ac nibh. Quisque vehicula lorem eget tortor. Aenean
molestie, magna sed tristique iaculis, leo dolor iaculis ante, vitae hendrerit sapien
felis eget tellus. Morbi non turpis. Suspendisse vestibulum, ligula a porttitor placerat,
lectus sapien venenatis elit, nec aliquam nulla nunc in dolor. In non nisl. Mauris
semper, nisl non convallis aliquet, erat tellus rhoncus lacus, et consectetuer felis
velit vitae lectus.</p>
</div>

<div id="foot">@copy; My Site 2004</div>
</body>
</html>



The above is a nice starting template, it is a clean slate with only minor structural elements, and you can easily start working the CSS to get the desired template or style. This is how I start doing the layout for most of my sites. Once you have the layout done and tested you can then move on to chopping the page up into your template files, adding in the necessary meta information, along with working in your other style sheets as needed and what not.

Starting off your design using tables and not doing thing the CSS way from the beginning is just begging for some problems. If you start off correctly you will not have a hard time doing things the "right" way.

You might want to check out
http://www.bluerobot.com
http://www.glish.com/css
These sites have a good number of pre-packaged layouts, which can make things a whole lot easier when starting out.



(Edited by WarMage on 06-17-2004 16:25)

Radical Rob
Bipolar (III) Inmate

From: Kapolei, Hawaii USA
Insane since: Jun 2001

IP logged posted posted 06-17-2004 22:06 Edit Quote

Sweet... thanks.



Post Reply
 
Your User Name:
Your Password:
Login Options:
 
Your Text:
Loading...
Options:


« BackwardsOnwards »

Show Forum Drop Down Menu