Jump to content

Get One Group Of Text/images To Wrap Around Another Group?


28j63o47w3rxfwk8
 Share

Recommended Posts

Is it possible to make one group of text/images wrap around another group? Like text wraps around an image? I have two "columns" of text/images of much different lengths, and I would like the longer one to fill the entire width available below the shorter one.I am working on this: http://www.catsociety.org/info/#fosterI've tried to do it with tables using SPAN, but couldn't get it to work for a row and a column simultaneously. Maybe there's a way with DIV that I haven't discovered...

Edited by Teffy
Link to comment
Share on other sites

Put some content inside a <div> element. Assign a width and height to the <div>. Use the CSS float property on the <div> and then put the rest of the content after it.Here's an example:

<div class="box1">Text<img src="something" alt="alt"></div>Some more content<div>A random block element</div>

.box1  {  width: 200px;  border: 1px solid;  float: left;}

Link to comment
Share on other sites

I thought span was deprecated? Anyway, div tags are ideal for this situation and it's really the "float" syntax you're looking for. "float:left" positions the image to the left of the text and wraps the text around it. "float:right" does the same but on the other side. I'm pretty sure that the wrap syntax can be used as well, but by default its on so that shouldn't matter.

Link to comment
Share on other sites

<span> isn't deprecated, it's a basic inline element.The only tags that are deprecated are ones that are used for presentation, such as <font> and <center>, which can be substituted with CSS.<span> tags are used in conjuction with CSS, so it would be foolish to deprecate it.

Edited by Ingolme
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...