Converting table-based layout to CSS — OZONE Asylum, home of the Mad Scientists

XML - XSL - XSLT - XHTML - CSS - DOM

Converting table-based layout to CSS

This page's ID: 10668

Edit Post

Who can edit a post?	The poster and administrators may edit a post. The poster can only edit it for a short while after the initial post.

Your User Name:
Your Password:
Login Options:	Remember Me On This Computer

Your Text: Insert Slimies » Insert UBB Code » Close Last Tag \| All Tags UBB Help	I think you problem here it that margin: auto works differently in IE as it does to NN6+ and Opera. Ok, since you have many different boxes of colour happening here you'd possibly get better results breaking things up some more and putting the z-index property to work. For example, You could have a single div for the thick dark brown stripe all the way accross the top of the page. Then over this you position the lighter brown area. Again in another div you put the title sitting in the middle. Setting up your page this way may force you to berak the psudo liquidity you have there. Although you are more likely to acheive a fully liquid result using a slightly more intricate mix of nested and un-nested divs. Setting them up from the left and right margins (both from the body and nested inside one another) and setting relative % width values is always a good way to start. Mixing inline, relative and absoulte divs makes an impressive toolset to work with. But if you don't want to get that close to CSS's ugly face just yet you should try re-arranging how you set out your site. At the moment you seem to have three rows of div's. Header div's, body div's and footer div's. Then you've split them up into several columns. How about doing it the other way around? Do your columns first then slot three rows into each column. You might need up to five columns for the layout your after which means you'll need to understand how the glish templates work so you can build onto them. Although, div's and CSS aren't tables. Copying a complex table based layout using only CSS isn't easy. You may or may not have to make some trade-in's along the way. Good luck. Loading...
Options:	Enable Slimies Enable Linkwords

« Backwards — Onwards »

Show Forum Drop Down Menu