Css Percentage & Fixed Width Combined and Wordwrap?

Rudy · 08-26-2008, 10:32 PM

Hey guys,
I'm using CSS, and I'm wondering if there's a way that I can do a 3 column layout where the far left has a fixed width and then the other two are percentages? Basically, I want 1 column at a fixed width. Then I want to be able to somehow calculate how much percentage that fixed width takes up, subtract it, and then use the remaining percentage for the other two columns.
????: NamePros.com http://www.namepros.com/programming/507983-css-percentage-and-fixed-width-combined.html

Does this make sense? Any ideas how I would accomplish this?

Also, I'm wondering if its possible / how to have a div or span or p or something that just creates a wordwrap effect, so that I can put in a picture or something, and the text in the surrounding div will just wrap around that picture.

- David

beaver6813 · 08-27-2008, 04:36 PM

First off to make text wrap around something like an image I usually do something like:

HTML Code:

<div>
<img src='lovelyimage.gif' width='200' height='300' alt='Lovely Image' style='float:left;margin:10px;'/>
Lots of other lovely lovely text! blal bla bla lorem dolar ipsum lorem dolar ipsumlorem dolar ipsumlorem dolar ipsumlorem dolar ipsumlorem dolar ipsumlorem dolar ipsumlorem dolar ipsum
</div>

That usually works for me...
????: NamePros.com http://www.namepros.com/showthread.php?t=507983

For the three column layout they can get rather complicated.. some good layouts can be found here (already coded up for ya

)
http://layouts.ironmyers.com/100_percent_Layouts/

Rudy · 08-28-2008, 12:26 PM

Hey, thanks Sam. I appreciate it! I think I've got the 3 column thing figured out. I already had it coded, I just needed to get the columns' widths changed and working properly. They are now - for the most part!

The code for the image is going to help a lot. I'll check it out. Do you think this might work if I wanted to put text on the left side of the image instead of the right?

- David

beaver6813 · 08-28-2008, 03:05 PM

Yep

Instead of style='float:left;margin:10px;' it'd just be style='float:right;margin:10px;'

08-26-2008, 10:32 PM	THREAD STARTER #1 (permalink)
Rudy NamePros Regular Join Date: Jul 2005 Location: United States Posts: 586	Css Percentage & Fixed Width Combined and Wordwrap? Hey guys, I'm using CSS, and I'm wondering if there's a way that I can do a 3 column layout where the far left has a fixed width and then the other two are percentages? Basically, I want 1 column at a fixed width. Then I want to be able to somehow calculate how much percentage that fixed width takes up, subtract it, and then use the remaining percentage for the other two columns. ????: NamePros.com http://www.namepros.com/programming/507983-css-percentage-and-fixed-width-combined.html Does this make sense? Any ideas how I would accomplish this? Also, I'm wondering if its possible / how to have a div or span or p or something that just creates a wordwrap effect, so that I can put in a picture or something, and the text in the surrounding div will just wrap around that picture. - David Last edited by Rudy; 08-26-2008 at 10:40 PM.

08-27-2008, 04:36 PM	#2 (permalink)
beaver6813 NamePros Regular Join Date: May 2005 Location: England Posts: 392 Follow @beaver6813	First off to make text wrap around something like an image I usually do something like: HTML Code: <div> <img src='lovelyimage.gif' width='200' height='300' alt='Lovely Image' style='float:left;margin:10px;'/> Lots of other lovely lovely text! blal bla bla lorem dolar ipsum lorem dolar ipsumlorem dolar ipsumlorem dolar ipsumlorem dolar ipsumlorem dolar ipsumlorem dolar ipsumlorem dolar ipsum </div> That usually works for me... ????: NamePros.com http://www.namepros.com/showthread.php?t=507983 For the three column layout they can get rather complicated.. some good layouts can be found here (already coded up for ya ) http://layouts.ironmyers.com/100_percent_Layouts/ __________________ -Beaver6813.com - Web Developer Extraordinaire!

08-28-2008, 03:05 PM	#4 (permalink)
beaver6813 NamePros Regular Join Date: May 2005 Location: England Posts: 392 Follow @beaver6813	Yep Instead of style='float:left;margin:10px;' it'd just be style='float:right;margin:10px;' __________________ -Beaver6813.com - Web Developer Extraordinaire!

08-28-2008, 12:26 PM	THREAD STARTER #3 (permalink)
Rudy NamePros Regular Join Date: Jul 2005 Location: United States Posts: 586	Hey, thanks Sam. I appreciate it! I think I've got the 3 column thing figured out. I already had it coded, I just needed to get the columns' widths changed and working properly. They are now - for the most part! The code for the image is going to help a lot. I'll check it out. Do you think this might work if I wanted to put text on the left side of the image instead of the right? - David

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)