liquid 2 column divs — OZONE Asylum, home of the Mad Scientists

XML - XSL - XSLT - XHTML - CSS - DOM

liquid 2 column divs

This page's ID: 11104

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	1) What is the ">" in style sheets for? For example, this site uses it [url=http://www.glish.com/css/7.asp]http://www.glish.com/css/7.asp[/url] What does[code]html>body #centercontent{ ... }[/code]modify? Does it mean use this style with any child body of the parent html that has the id "centercontent"? If so, I don't really understand what it does, or why its there, because it seems like it's already declared in the example. 2) If I use #idname will the style only affect the first object it finds with the id "idname"? 3) (the main question) I want 2 columns, the left one is only as wide as the widest text on it. The right column should take up the page's remaining width. If I set the left colums width to 20% and the right to 79% it sort of works, but, if I change it to 80% it will break to the next line. Here's what I have so far, do you see any errors?[code]index.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <title>2 columns xhtml and css</title> <link rel="stylesheet" type="text/css" href="style.css" /> </head> <body> <div id="leftcontent"> <p>left content</p> <p>left <a href="#">link</a></p> <p>left content</p> </div> <div id="rightcontent"> <p>right content</p> <p>right content</p> <p>right content</p> </div> </body> </html>[/code][code]style.css a { color:#CC3300; text-decoration:none; } a:hover { color:#006600; text-decoration:underline; } body { background-color:#808080; color:#000000; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; } p { margin: 10px 5px 10px 5px; padding: 0px 0px 0px 0px; } #leftcontent { border: 1px dashed #000000; background-color: a0a0a0; float: left; width:25%; } #rightcontent { border: 1px dashed #000000; background-color: c0c0c0; float: left; }[/code] [This message has been edited by ninmonkey (edited 11-22-2003).] Loading...
Options:	Enable Slimies Enable Linkwords

« Backwards — Onwards »

Show Forum Drop Down Menu