<div> restrict
Hi, i have now started to lay out my websites using css only i have a problem. If i enter some text in between the div tags, and the text is longer that the div, the text will simply continue over pass the div and across the page. With a table it will wrap nicly. How can i make the div act like a table in a way that the text will continue on a new line when it gets to the full width of the div?
Hope this makes sense. I tried to put a table inside the div but it just messed things up and then i figured if it did work i may as well just use tables and not divs?
Help.
Megan posted this at 15:03 — 16th May 2006.
She has: 11,421 posts
Joined: Jun 1999
What do you mean the text is longer than the div? How are you specifying the size of the div? If you put up a link to what you've got it might be easier to help.
You could also look at the overflow property:
http://www.w3schools.com/css/css_reference.asp#positioning
Megan
Connect with us on Facebook!
steve40 posted this at 15:47 — 16th May 2006.
He has: 490 posts
Joined: May 2005
This do's it.
Text
JeevesBond posted this at 18:51 — 16th May 2006.
He has: 3,956 posts
Joined: Jun 2002
It sounds like you haven't set the width of the div in your CSS. For instance, if you have this DIV:
<div id="header">... content ...
</div>
then, in your CSS you could have:
#header {width: 10em;
}
That should cause the text to wrap when it reaches a width of 10em (em is a related to character size, if you design using em your layouts will change according to how big or little the user has their font size set to). If you're a little mystified/uncomfortable with em you can start with px or % until you feel ready to experiment.
If you're still unsure then do as Megan suggested: Post a link and we'll have a look.
a Padded Cell our articles site!
Busy posted this at 21:49 — 16th May 2006.
He has: 6,151 posts
Joined: May 2001
Long links especially will always overlap the CSS div, example the link Megan gave above over laps the div, the code JeevesBond gave overlaps the div.
On a fixed layout the only real way is to use smaller font size or scroll it for long links, div's within div's need to be set within the parents dimensions
Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.