Jump to content
Stef's Coding Community
Guest pillsbury

2 columns of text layout problem

Recommended Posts

Guest pillsbury

willheader.gif

about

process

portfolio

contact

ABOUT

Products should function well and be aesthetically pleasing to the eye. This philosophy is common to anyone who designs products. But 99999PURE goes one step further in the belief that products need that extra essence to turn a product into something that people like into a product that people love.

9999PURE strives to recognize this quality in every product it creates. It could be simplifying the design of an overly complex object. It could be adding character to an object that previously had no character. It could be the creation of a whole new experience or a rehashing of a previously abandoned experience. Each case is different in its own unique and individual way.

More and more objects nowadays are being created for no reason other than to fill a need. Products can and should be more than that. Products have the potential to be an audio, visual, and tactile experience that enriches peoples? lives on a daily basis. There should be intent behind decisions that are rooted in creating this experience as opposed to adding just another bullet point on the package.

9999 PURE is the belief that if you create products in an honest way, the world will reward you.

Share this post


Link to post
Share on other sites

Don't worry about what Dreamweaver shows you in Design View as long as what you see in the different browsers you test in are OK. Don't even use Design View to do anything it will get you in trouble.

Share this post


Link to post
Share on other sites

2 columns

* {

margin:0;

padding:0

}

body {

width:900px;

margin:0 auto;

}

#left {

float:left;

width:50%;

padding-bottom:5px;

background:red;

}

#right {

overflow:auto;

background:blue;

padding-bottom:5px;

}

* html #left {

margin-right:-3px;

}

* html #right {

height:1%;

}

 

test

 

Share this post


Link to post
Share on other sites
Guest pillsbury

thank you so much!!! i know this sounds pretty idiotic but i spent so much time trying to figure this out...

 

i have a lot to learn.

Share this post


Link to post
Share on other sites
thank you so much!!! i know this sounds pretty idiotic but i spent so much time trying to figure this out...

 

i have a lot to learn.

 

It's not idiotic at all. The concept is much harder than it should be actually.

Share this post


Link to post
Share on other sites
Guest pillsbury

thanks! makes me feel a bit better.

 

question: what that bit of code do? tried looking it up on google but i couldnt get a clear explanation.

 

* html #left {

margin-right:-3px;

}

* html #right {

height:1%;

}

Share this post


Link to post
Share on other sites

Eric may have to fill you in with what it does exactly, but the "* html" part is a CSS hack to target IE6, so I am guessing that they are intended to fix browser rendering inconsistencies in IE6.

Share this post


Link to post
Share on other sites

by the way, if you know that content of your divs will be only text, apply your CSS directly to

selector:

 

Some text

Share this post


Link to post
Share on other sites
thanks! makes me feel a bit better.

 

question: what that bit of code do? tried looking it up on google but i couldnt get a clear explanation.

 

* html #left {

margin-right:-3px;

}

* html #right {

height:1%;

}

 

I'm having a bit of fun with this right now actually. Currently, I'm working on my 6th way to achieve 50% equalizing columns. Uhm let's see...

 

Both target ie6. the margin-right:-3px takes care a 3px job bug that only appears when a static box is next to a floated box. And the 1% height gives "haslayout" to ie6. Otherwise the text flows to 100% of the parent container (in this case the body). And ie6 treats height as min-height, so it will always expand to allow whatever sized content. Both are completely safe.

Edited by Eric

Share this post


Link to post
Share on other sites

Here is another one you might feel more comfortable using - it's a little easier to understand.

 



{ visibility: inherit; } 2 Equal Columns
<br />* {<br />margin:0;<br />padding:0;<br />}<br />body {<br />background:#ccc;<br />text-align:center;<br />}<br />#wrap {<br />width:900px;<br />margin:0 auto;<br />background:#999;<br />overflow:hidden;<br />}<br />#left {<br />float:left;<br />width:50%;<br />background:#999;<br />}<br />#right {<br />float:left;<br />width:50%;<br />background:#777;<br />}<br />p {<br />padding:10px;<br />}<br />




yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada
yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada


yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada
yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada
yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada yada



Edited by Eric

Share this post


Link to post
Share on other sites
Guest pillsbury

thank you so much.

 

i thought i could get away using dreamweaver a few days ago, but i'm starting to learn how to write more instead of using the menu options.

 

it'll take a while but i feel like it'll be worth it. i realize that i need to focus on the basics - layouts and divs.

 

thanks again!

Edited by pillsbury

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...