Converting Tables to Div's

supabeast · October 2012

Don’t even bother doing it yourself. Just use an artist/designer’s portfolio service like Squarespace or Behance that will let you tweak the colors and drop in your logo.

Overlord · October 2012

For the fixed pixel width and height thats pretty easy. You can just set the div width and height with CSS

height:900px;
width:399px;

etc.

The gallery page you might need to use a separate div ID cause then you could just leave out the height and it would automatically size to whatever content you put inside the div.

By default divs don't have borders so you're fine there

For setting it up I would use nested divs.

To lay it out this is how I'd do it (multiple divs)

body
header
content
bottom (for the part where its page title/description)
footer

Hopefully this helps/makes sense.

bowen · October 2012

Your website looks pretty okay to me. I'd probably still use the iframe as of current? Obviously you can get away from the table stuff into divs, that should be relatively easy though. You can get around iframes with scripting languages, and possibly, ajax. But you're an artist right? Not sure you want to dabble in that stuff. Overlord is giving you good information for the div stuff.

HTML5 still supports iframe for instance.

You might also try using validators for CSS and HTML in the future.

http://validator.w3.org/

It'll show you stuff that might catch you up in other browsers or isn't compliant with normal web design. Just for my own knowledge, how much html/css are artists supposed to know?

NightDragon · October 2012

bowen · October 2012

Yeah the alternative is trying to use a div and javascript... I would not recommend that.

You could something like this in php:

<div class="iframe">
    <?php include("/content/artsypage1.html"); ?>
</div>

Which means you could keep your content separate from your design for the most part. You can get super fancy or not. I assume your webhost can handle php? But at this level you're going into programmer territory.

This option is far better than the javascript/div choice though.

NightDragon · October 2012

Oh dang, that looks really easy. And yep - my webhost supports PHP.

If that method doesn't require much beyond copy/pasting code like that, I think that'd be a great solution.

bowen · October 2012

That should work. Obviously you'll need the CSS tied to the div. But it accomplishes the same thing while tricking the observer/validators that it's a single page.

Give it a shot, let me know and I can help rattle it down further if it gives errors or doesn't look quite right.

Also, to be 100% valid HTML, those included pages should only be partials, as you'll be popping it into a page that already has the <html> tags in it. I think.

NightDragon · October 2012

Coolio. Thanks a lot!

EWom · October 2012

You can use min-height: for a div, which sets the minimum height for the div, but allows it to expand. Google it though, because you're going to need to put in some IE handling for it IIRC.

wmelon · October 2012

you only have to worry about that if you care about ie7 or below. My opinion on the matter is no

Penny Arcade

Quick Links

Converting Tables to Div's

Posts