CSS: Hur få mindre avstånf mellan paragrafer?

Tråden skapades och har fått 20 svar. Det senaste inlägget skrevs .
1

Håller på och gör min första hemsida med CSS, funkar riktigt bra. Men hur ställer jag in så att avståndet inte blir så stort när det kommer ett "enter" eller ny rad i texten? Nu blir det som en hel tom rad typ.

Det ser ju inte så kul ut om det är typ så här:

"Rubrik

Text text text"

  • Medlem
  • Stockholm
  • 2005-04-24 12:13

Mindre avstånd mellan stycken menar du?

Ursprungligen av Mondo:

Mindre avstånd mellan stycken menar du?

just det

  • Oregistrerad
  • 2005-04-24 12:15
Ursprungligen av Stefan Swales:

Håller på och gör min första hemsida med CSS, funkar riktigt bra. Men hur ställer jag in så att avståndet inte blir så stort när det kommer ett "enter" eller ny rad i texten? Nu blir det som en hel tom rad typ.

Det ser ju inte så kul ut om det är typ så här:

"Rubrik

Text text text"

p {
font: normal 10px Verdana, Arial, Helvetica, sans-serif;
text-align: left;
margin: 0px;
padding: 0px;
}

Istället för 0px kan du ju skriva in vilket värde du vill!

Annars kan du ju hålla inne skift-tangenten när du trycker på enter!

Ursprungligen av jalvander:

p {
font: normal 10px Verdana, Arial, Helvetica, sans-serif;
text-align: left;
margin: 0px;
padding: 0px;
}

Istället för 0px kan du ju skriva in vilket värde du vill!

Annars kan du ju hålla inne skift-tangenten när du trycker på enter!

Är det alltså padding det heter? Shift-tangenten verkar inte göra ny paragraf - alltså även om det blir ny rad så formateras brödtexten då likadant som texten ovanfär, t.ex. en underrubrik.

Både padding och margin påverkar. padding är området innanför ramen (border) och margin är området utanför. I det här fallet har du ju ingen border, så resultatet blir detsamma. Men jag skulle använda margin.

Box model kallas allt det här.
Läs mer om box model.
En länk till om box model.

Ursprungligen av leenus:

Både padding och margin påverkar. padding är området innanför ramen (border) och margin är området utanför. I det här fallet har du ju ingen border, så resultatet blir detsamma. Men jag skulle använda margin.

Box model kallas allt det här.
Läs mer om box model.
En länk till om box model.

Tack för länkarna! (Nu blir det till att plugga . . . igen, suck. Tänk, man trodde pluggandet var slut när man gick ut skolan, ack så fel man hade.)

Ursprungligen av leenus:

Både padding och margin påverkar. padding är området innanför ramen (border) och margin är området utanför. I det här fallet har du ju ingen border, så resultatet blir detsamma. Men jag skulle använda margin.

Box model kallas allt det här.
Läs mer om box model.
En länk till om box model.

Okej, jag har kollat på artiklarna om box model, men får det ändå inte att funka. Mellanrum mellan paragrafer, har det verkligen med padding eller marginal att göra? Blir alltså varje paragraf en egen "box"?

Ursprungligen av Stefan Swales:

Blir alltså varje paragraf en egen "box"?

Exakt.

  • Medlem
  • Karlstad
  • 2005-04-25 06:30
Ursprungligen av Stefan Swales:

Okej, jag har kollat på artiklarna om box model, men får det ändå inte att funka. Mellanrum mellan paragrafer, har det verkligen med padding eller marginal att göra? Blir alltså varje paragraf en egen "box"?

Om du har "rubrik" i en annan tag, t.ex. en <h1> eller annan h-tag, så måste du givetvis justera den också.

Nu funkar det! Tjoho!
Jag var alltså tvungen att ändra "Margin" till -0.5em under på h1 och h2 och -0.5em över på body. Lite knepigt kan tyckas först men man vänjer sig. Ganska häftigt detta med CSS!

  • Medlem
  • Mölndal
  • 2005-04-24 13:21

I det här fallet är det margin-top och padding-top som är aktuella. Övriga mariginaler finns ingen anledning att ändra på.

  • Medlem
  • Höganäs
  • 2005-04-24 14:06

Får väl passa på att tipsa om systerforumet http://99web.se

  • Medlem
  • Höganäs
  • 2005-04-25 10:54

OT: Jo, det är häftigt med CSS!
http://www.csszengarden.com/
Där kan du ändra utseende (minst sagt) på samma grundkod genom att välja något av de olika teman som finns. Häftigt!
/OT

Nu har jag ett liknande problem, men orkar inte starta ny tråd:
Texten ser ut som jag vill ha den i GoLive, men när jag sen kolla på sidan i en browser så blir body-texten för stor. Bold-varianten blir rätt storlek . . . mycket skumt, för de har båda storleken x-small. Nån som vet vad det beror på?

  • Medlem
  • Karlstad
  • 2005-04-25 15:30
Ursprungligen av Stefan Swales:

Nu har jag ett liknande problem, men orkar inte starta ny tråd:
Texten ser ut som jag vill ha den i GoLive, men när jag sen kolla på sidan i en browser så blir body-texten för stor. Bold-varianten blir rätt storlek . . . mycket skumt, för de har båda storleken x-small. Nån som vet vad det beror på?

Relativa storlekar som t.ex. "x-small" eller i procent relaterar till användarens inställningar i webbläsaren, dvs vilken storlek han har som default.
Vill du ha en exakt storlek så använd pixelstorlek.

Ursprungligen av Danne V:

Relativa storlekar som t.ex. "x-small" eller i procent relaterar till användarens inställningar i webbläsaren, dvs vilken storlek han har som default.
Vill du ha en exakt storlek så använd pixelstorlek.

Men det konstiga är ju, som jag sa, att jag har två olika taggar med samma värde, men webläsaren visar dem olika stora.

  • Medlem
  • Karlstad
  • 2005-04-25 15:49
Ursprungligen av Stefan Swales:

Men det konstiga är ju, som jag sa, att jag har två olika taggar med samma värde, men webläsaren visar dem olika stora.

Egentligen måste du ge en URL till sidan så att man får se vad du pysslar med. Annars kan det här ta tid....

Men om du t.ex. har x-small i en p-tag och en h1-tag, så relaterar storleken till webbläsarens default för de båda. För p-taggen kanske webbläsaren har 12px, för h1-taggen kanske 20px. Ditt "x-small" är alltså inte en exakt måttangivelse, utan säger till läsaren att "nu ska stilen vara x-small i relation till p-taggens 12px och h1-taggens 20px".

Men som sagt: Ladda upp sidan, ge en URL.

Ursprungligen av Danne V:

Egentligen måste du ge en URL till sidan så att man får se vad du pysslar med. Annars kan det här ta tid....

Men om du t.ex. har x-small i en p-tag och en h1-tag, så relaterar storleken till webbläsarens default för de båda. För p-taggen kanske webbläsaren har 12px, för h1-taggen kanske 20px. Ditt "x-small" är alltså inte en exakt måttangivelse, utan säger till läsaren att "nu ska stilen vara x-small i relation till p-taggens 12px och h1-taggens 20px".

Men som sagt: Ladda upp sidan, ge en URL.

Okej, då fattar jag. Nu fick jag till det. Det är lite ovant att ha att göra med relativa storlekar för en som sysslat med tryckalster halva livet.
Tyvärr kan jag inte lägga upp en URL för min domän är spärrad på detta forum av nån konstig anledning . . . Ehrrm! [HALLÅ ADMINISTRATÖRER, jag har slutat med signaturer för länge sen.]

  • Medlem
  • Karlstad
  • 2005-04-25 16:18
Ursprungligen av Stefan Swales:

Okej, då fattar jag. Nu fick jag till det. Det är lite ovant att ha att göra med relativa storlekar för en som sysslat med tryckalster halva livet.
Tyvärr kan jag inte lägga upp en URL för min domän är spärrad på detta forum av nån konstig anledning . . . Ehrrm! [HALLÅ ADMINISTRATÖRER, jag har slutat med signaturer för länge sen.]

Konstigt att du inte kan skriva ut en URL....det är ju bara att skriva http://www.minsajt.se
Men funkar det inte kan du väl skriva "www punkt minsajt punkt se" eller nåt.
Försök med det när du postar en fråga, eftersom man slipper en massa onödiga gissningar och förvirring.

Senast redigerat 2005-04-25 16:32
Ursprungligen av Danne V:

Konstigt att du inte kan skriva ut en URL....det är ju bara att skriva http://www.minsajt.se
Men funkar det inte kan du väl skriva "www punkt minsajt punkt se" eller nåt.
Försök med det när du postar en fråga, eftersom man slipper en massa onödiga gissningar och förvirring.

Okej. Jag gör det nästa gång. Nu har jag ju fått lösningen. Tack.

1
Bevaka tråden