3 replies [Last post]
CrowMasTeR
Offline
newbie
Last seen: 11 years 19 weeks ago
Joined: 2008-07-09
Posts: 2
Points: 0

hello everyone. im sorry if this question has been asked here before and got answer, its just that ive scanned the web for hours and cant stand even one more search button click Sad

im not a css expert however ive created few templates that were quite successfull... but i just cant recreate on simple thing-

how do you make a simple box(div with WIDTH and BORDER), to break the text line once reached to its edge?

for example, the div without text is this size: __________
however if you overflow it it gets _________________.
i wnat it to make the part of the text that passed the edge to move to the next line.
how is that possible?(i know it is, i just cant remember what i did last time)

Stomme poes
Stomme poes's picture
Offline
Elder
Netherlands
Last seen: 8 years 3 weeks ago
Netherlands
Timezone: GMT+2
Joined: 2008-02-04
Posts: 1854
Points: 378

Well, you can't, really.

Well, you can't, really. Normally, words would wrap-- but they do so only when they encounter whitespace. So if your word is
http://blahblahblah.com/something/somethingelse/anotherthing12345/andanotherthing1234567.php?default/otherstuffetcetcetc... then you cannot do anything...

*except in Internet Explorer, where you can use the non-standard
#box {
word-wrap: break-word;
}
to break the word simply where the width stops. Of course, we know IE6 will otherwise let the #box grow to accomodate the text, rather than letting the text spill out. Break-word is our hack against this non-standard behaviour, so it compliments IE's sillyness.

And, there is the "soft hyphen" (character: ­), which doesn't work in FF2 and below, and actually I have no idea if it's honoured by FF3 (hopefully it is), but works in every other browser so far as I know... The soft hyphen, as opposed to the - you type from the keyboard, is a "breakable" hyphen. So
blahblahblahyakkityyschmakkity­blahblahblah would be broken at the hyphen, while still looking like a normal short (en) hyphen.

Anyhoo, most people have the opposite problem, since text naturally wraps-- they want the wrapping to stop. Again, only break-word: keep-all from IE does anything (this was invented specifically for Chinese, Japanese and Korean text but works on any text so far as I know).

*edit just checked on someone's machine, FF3 supports soft hyphen. Yay!

I'm no expert, but I fake one on teh Internets

CrowMasTeR
Offline
newbie
Last seen: 11 years 19 weeks ago
Joined: 2008-07-09
Posts: 2
Points: 0

THANKS!

it seems that ive done a really stupid mistake... you see, at previous designs, i posted some random articles to check the block compatability, however ive never tried a long word such as "asdasdasdasdasdasdasdasdasdasdasasdasd..." thats why i couldnt notice this bug before...
but at least now i know what caused this... thanks a million...

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 4 years 45 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

Yes shy is implemented in

Yes shy is implemented in FF3, so it should be ok to start using it as FFoxers will not be dumb enough not to upgrade their beloved browser.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me