[CSS] letter-spacing probleem

[Bartoz]

Ik gebruik deze code in mijn Style-Sheet:

code:

td
{
  font-family                 : arial,verdana,arial black,sans serif,times new roman;
  font-size                    : 9pt;
  letter-spacing            : 1px;
  line-height                 : 150%;
}

Het gaat hier om de letter-spacing component. Als ik deze weghaal dan wordt een stuk HTML tekst in de table zo weergegeven:

Hallo,

Ik ben.

Als ik deze er weer neerzet wordt de tekst zo weergegevenL

Hallo,
Ik ben.

Oftwel 1 <BR> zorgt er nu niet voor dat er naar de volgende regel wordt gesprongen. 3 * <BR> zorgt er wel voor dat de tekst met een lege regel wordt afgebeeld. Doe ik nu iets basic verkeerd in CSS Of is dit normaal ?

[Willem]

Dat is altijd zo

Wil je een extra witregel zul je echt 2x een br moeten geven of je zou een beetje moeten spelen met je margin-top

[disjfa]

nix

[ Voor 98% gewijzigd door disjfa op 14-02-2003 16:44 ]

[Bartoz]

willem169 schreef op 14 February 2003 @ 16:43:
Dat is altijd zo

Wil je een extra witregel zul je echt 2x een br moeten geven of je zou een beetje moeten spelen met je margin-top

Nee foutje van mij, door die letter-spacing moet ik nu drie maal een <BR> geven voor een witregel: dus

text<br><br><br>text

Om dit te krijgen,

Hallo,

Ik ben....

Dat vind ik dus raar.....

[Puck]

Gebruik <P> en stel daar zelf de hoogte van in d.m.v. css?

[1st_Ro]

Heeft die line-height van 150% er nix mee te maken ???

[Verwijderd]

nada

[ Voor 105% gewijzigd door Verwijderd op 14-02-2003 18:57 ]

[bRight]

Bekend probleem.. inderdaad kun je het best spacen met <p>

zo dus

HTML:

<p>
Hallo,
</p><p>
Ik ben....
</p>

[Blaise]

Vraagje tussendoor:

heeft het nut een <p> tag af te sluiten?
of zorgt het er alleen voor dat de browser niet het hele document doorzoekt naar de eindtag? (zoals bijv. een <br />)

[Tham]

je line-hight is de interlinie die bepaalt de witruimte tussen de regels.
letter-spacing is witruimte tussen je L E T T E R S .

als je je line-hight heel hoog zet zoals jij nu gedaan hebt 150% en je letterspacing minimaal maakt 1px trekt hij alles weer naar elkaar toe.

als je het niet voor een speciaal doel hoeft te gebruiken zou ik als ik jou was van de letter-spacing afblijven, want tekst wordt er zeker niet leesbaarder op.

style sheet tutorial:
http://hotwired.lycos.com/webmonkey/98/15/index2a_page2.html

[Bosmonster]

Blaise schreef op 15 February 2003 @ 00:48:
Vraagje tussendoor:

heeft het nut een <p> tag af te sluiten?
of zorgt het er alleen voor dat de browser niet het hele document doorzoekt naar de eindtag? (zoals bijv. een <br />)

Hangt af van de gebruikte standaard, in HTML4 is geloof ik niet verplicht, maar in XHTML uiteraard wel.

En zoals tham zegt: letter-spacing is horizontale spacing, dus dat zal weinig met de afstanden tussen je regels te maken hebben..

[ Voor 76% gewijzigd door Bosmonster op 15-02-2003 08:45 ]

[Bartoz]

Ik heb de letter-spacing er maar uitgehaald. Ik vind dat de line-height component wel tot een betere leesbaarheid kan leiden.

[drm]

Wanneer je een font-size absoluut opgeeft, kun je de line-height ook gewoon absoluut opgeven:

code:

p {
   line-height:16px;
   font-size:10px;
   letter-spacing:1px;
}

Verder moet je <br />'s zo veel mogelijk vermijden. Het nadeel van <br />'s is namelijk dat je er amper controle op hebt met je stylesheet, terwijl juist de bedoeling is dat je in HTML de structuur van je document opmaakt, en in CSS de stijl vastlegt.

Verder is er in "normale" teksten ook altijd sprake van "paragrafen", dus waarom zou je dat in HTML niet gewoon gebruiken?

[Verwijderd]

drm schreef op 15 februari 2003 @ 11:24:
Wanneer je een font-size absoluut opgeeft, kun je de line-height ook gewoon absoluut opgeven

Het voordeel van percentages is dat je niet meerdere waarden in je stylesheet hoeft te veranderen als je de letters net een maatje groter of kleiner wilt hebben. Een maat opgeven in pixels doe je omdat je de maat echt op exact die grootte wilt hebben. Het nadeel is dus dat er een soort evenwicht tussen lettergrootte en marges in gevaar kan komen als je bijvoorbeeld een andere font-size gebruikt.

Marges rond paragrafen geef ik vaak op in em, evenals text-indent, en andere CSS properties die je meestal in en rond teksten gebruikt

Verder moet je <br />'s zo veel mogelijk vermijden. Het nadeel van <br />'s is namelijk dat je er amper controle op hebt met je stylesheet, terwijl juist de bedoeling is dat je in HTML de structuur van je document opmaakt, en in CSS de stijl vastlegt.

Om hier even een eenvoudig en toch duidelijk voorbeeldje te geven: stel je hebt een website met 20, 200 of 2000 pagina's met tekst. Nu vraagt een klant of het misschien mogelijk is om de eerste regel van een paragraaf iets in te laten springen.

Als je dan <br /> tags hebt gebruikt, en geen <p> tags, dan kun je jezelf wel voor je kop slaan, omdat je voor elke alinea  's kunt gaan zetten. Met de <p> tags geef je simpelweg even in je stylesheet het volgende op:

Cascading Stylesheet:

p
{
   text-indent: 1em;
}

Die <br /> tags kun je wel gebruiken binnen paragrafen, als je echt een zin op een nieuwe regel wilt laten beginnen, maar volgens mij gaat het dan vrijwel altijd om een nieuwe paragraaf. (En die kun je weer niet laten inspringen in dat geval )

Kies er dan liever voor om de marge's van paragrafen op 0 te zetten, en bedenk een manier om je teksten dan in grotere stukken te verdelen, als je tussen sommige paragrafen wél witruimte wilt. Definieer bijvoorbeeld een CSS class voor de eerste paragraaf na zo'n witruimte, maar mooier is het gebruik van sections. (de section tag wordt geïntroduceerd in XHTML 2.0, het is eigenlijk ook een algemeen container element, net als <div>, dus een <div class="section"> zou dit element voorlopig kunnen nabootsen)

Verder is er in "normale" teksten ook altijd sprake van "paragrafen", dus waarom zou je dat in HTML niet gewoon gebruiken?[/nohtml]

Het enige geval waarin je moet overwegen om géén <p> elementen te gebruiken, is als je niet echt kunt spreken van een paragraaf, of zelfs zin. Bij een zin zou ik waarschijnlijk al van die paragraaf tags gebruik maken