Avatar billede phansen79 Nybegynder
01. juli 2015 - 11:53 Der er 2 kommentarer

Linjeskift ved special tegn

Er det muligt at lave et linjeskift i CSS der kun sker når der er et special tegn? i dette tilfælde (-)

Mit problem er at mine produktnavne er for lange, men desværre nødvendige. Fra et design synspunkt ville et linjeskift på det helt rigtige sted være perfekt. Her tænker jeg at CSS måske kan koden sådan.

Sådan ser det ud nu:

Regular Fit - Classic Crew Neck,
Hvid

Sådan måtte det gerne se ud:

Regular Fit
Classic Crew Neck, Hvid
Avatar billede klaus_a Nybegynder
01. juli 2015 - 13:16 #1
Hvis det kommer fra en DB ville jeg ville nok vælge at parse på teksten, og erstatte "-" med <br> og på den måde få fuld kontrol den.

Hvis du selv skriver det ind kan du vel benytte et <br>?
Avatar billede Slater Ekspert
01. juli 2015 - 14:53 #2
Der er ingen direkte måde i CSS at fortælle hvor du helst vil have linjeskift. Den bedste løsning er dette:


<html>
<head>
  <style>
  .nobreak {
    display: inline-block;
  }
  </style>
</head>
<body>

  <h1>
    <span class="nobreak">Regular Fit</span>
    <span class="nobreak">Classic Crew Neck</span>
  </h1>

</body>
</html>


- Men som du kan se kræver det, at du skriver nogle ekstra HTML tags i dine produktnavne.
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester