Woorddelen NIET afbreken

[GerardX]

Twee gescheiden woorden middels   bij elkaar houden is een mooie optie, maar hoe houd je twee woorddelen bij elkaar? In het Nederlands kennen we (vele) samenstellingen oftewel samengestelde woorden. Sommige horen gescheiden te worden door een koppelstreepje. Dat koppelstreepje blijkt als een afbreekstreepje te worden gezien. Eigenlijk zou je verwachten dat er een optie is om dat afbreken te voorkomen en misschien is die er ook. Misschien iets als &nbwd; aan het begin van zo'n woord, dat werkt tot de eerstvolgende spatie?

 

[Aar]

Dat is als ik mij niet vergis de:
& shy ;

Maar dan zonder spaties erin.

Zie hier een voorbeeld, en maak het scherm eens kleiner:
https://jsfiddle.net/uca7412m/1/

 

[GerardX]

Dat is als ik mij niet vergis de:
& shy ;

Maar dan zonder spaties erin.

Zie hier een voorbeeld, en maak het scherm eens kleiner:
https://jsfiddle.net/uca7412m/1/

Gedaan en ik zie in het witte venster rechtsonderin een andere tekst dan tussen <p></P> en nergens kan ik vinden waar dat '& shy ;' staat. Niettemin, door zoeken op '& shy ;' heb ik wel info gevonden die het me duidelijk maakte.
Kennelijk moet ik in de body-stijl ';hyphens: none;' opnemen en dan word geen enkel woord afgebroken.
Vanavond eens wat uitproberen en morgen laat ik weten hoe en wat.

 

[Aar]

Gedaan en ik zie in het witte venster rechtsonderin een andere tekst dan tussen <p></P> en nergens kan ik vinden waar dat "*" staat.

De tekst is hetzelfde, maar ik heb 'ontzichtbare afbreekstreepjes' in de HTML toegevoegd. Als je het browserscherm (viewport) kleiner maakt, dan zie je dat de tekst op die plek wordt afgebroken met een afbreekstreepje.

Niettemin, door zoeken op "*" heb ik wel info gevonden die het me duidelijk maakte.
Kennelijk moet ik in de "body"-stijl "hyphens: none;" opnemen en dan word geen enkel woord afgebroken.
Vanavond eens wat uitproberen en morgen laat ik weten hoe en wat.

Met CSS kan je ook een hoop bewerkstelligen.

 

[bron]

Om woorden of delen van een zin bij elkaar te houden doe ik dit

In de stylesheet

.nowrap {
   white-space: nowrap;
}

In de html

Het bedrijf maakt <span class="nowrap">keuken- en kledingkasten</span> op maat.

In dit voorbeeld blijft keuken- en kledingkasten altijd op 1 regel.
Test dit altijd ook even op smartphone of de regel daardoor niet buiten beeld valt.

Ideaal bij linkjes die (best wel lelijk) aan het eind van een regel op de volgende regel verder gaan. Simpel op te lossen met

Meer info in de <a class="nowrap" href="privacy">privacy statement</a>