Overflow i <div> medfører resten af teksten i ny <div>
Her er en lille kuriøs ting:Jeg har to lige store <div>'s ved siden af hinanden. Den ene indeholder nogle afsnits tekst (lad os kalde den <div>#1), den anden et billede (<div>#2).
Teksten trækkes fra en database, og nogen gange kan der godt forekomme mere tekst i <div>#1, end layoutet tillader.
Jeg kunne godt tænke mig noget i stil med det, man kender fra DTP-programmer: Hvis der er mere tekst i <div>#1, end der er plads til, fortsætter teksten i <div>#2 (og erstatter dermed billedet).
Jeg skal være ærlig og sige, at det ikke er noget konkret, jeg sidder og koder. Derfor er jeg heller ikke specielt interesseret i egentlig kode. Det er mere et spørgsmål om metode.
- Hvordan skulle man gribe sådan noget an?
- Hvad skal jeg have fat i for at se, om der er overflow i en <div>?
Og for at dele teksten op, forestiller jeg mig umiddelbart, at jeg skulle lave en eller anden decision i stil med:
Så længe der er overflow i <div>#1{
Klip det sidste bogstav i indholdet og put det forrest i en ny variabel (til <div>#2)
}
Tag hele det sidste ord fra <div>#2 og put det forrest i variablen (til <div>#2) //for at sikre, at den ikke klipper midt i et ord.
Det er ikke relevant at sikre, at der kommer overflow på <div>#2. Der er i alt aldrig mere end dobbelt så meget tekst, som der er plads til i <div>#1. (Don't ask ... sår'n er'ed bare ;-)
Forslag til metode søges ... :-)