• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 164
  • Last Modified:

Create two column text format in DIV

I'd like two contain text in a div that has two columns.  I need the text to flow from one column to the other.  The text may have HTML tags (i.e. bold, h3, etc), which I don't want broken.  To create the white space, I've sized a 1px image to about width=20px and height=200px. I then applied different styles to the image's style attribute.  The image always appears on top of the text, rather than pushing it aside to create a middle white space gutter.

Is there a way to correct this or a better way?
0
brettr
Asked:
brettr
2 Solutions
 
TheKyleCommented:
Without specifically splitting the text into two different divs that are floated side by side, there is no way to get text to flow from one column to another.

To learn more about multi column layout, read this...

http://www.456bereastreet.com/lab/developing_with_web_standards/csslayout/2-col/

Also, spacer images are never a good idea.  CSS has way more than enough power to create white-space between columns.
0
 
xberryCommented:
implemented in CSS3 but some browsers still hanging back there:
(IE not supporting it at all: http://www.geocities.com/seanmhall2003/css3/compat.html#sel)
http://www.css3.info/preview/multi-column-layout/
http://www.w3.org/TR/css3-multicol/

Alternative solutions until Internet Explorer will support CSS3:
http://randysimons.com/pagina_129_NL.xhtml
0

Featured Post

Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now