Odległość Między Akapitami

[thunder_pl]

Witam

 

mam problem. Nie wiem jak ustalić odległość w css między akapitami <p>. Jedyne co wiem, to że

text-height

zmienia odległość między dwoma wierszami :/

 

Proszę o pomoc

[Sid]

Tak strzelam: padding-top i padding-bottom?

[Albi_On]

moze

text-indent: 8%

[thunder_pl]

Tak strzelam: padding-top i padding-bottom?

nie, to nie to

 

moze

text-indent: 8%

to robi "wcięcia" akapitów w pierwszym wersie danego akapitu, ale nie określa odległości między nimi (akapitami).

[Gość]

Jesli masz te akapity jeden po drugim to margin-top / margin-bottom sie nada.

[czeski_lodz]

no więc tak:

padding-top, bottom, left, right: wartość;

tyczy się odstępu wewnętrznego komórki tabeli

margin-top,bottom,left,right

tyczy się odstępu obiektu od obiektu tekstu od np. obrazka, tekstu od krawędzi komórki tabeli itp.

Przechodzimy do meritum. Nie wiem co skopałeś w kodzie ale

text-height: wartość;

jest odpowiedzialna za odległość między akapitami i nie ma innej możliwości.

Przy ustaleniu stylu na np.

p.zwieksz-odstep {	text-height: 14px;}

<p class="zwieksz-odstep">
1 linijka
2 linijka
3 linijka
4 linijka
5 linijka
</p>

Spowoduje uzyskanie magicznego odstępu między wierszami akapitu.

Fido natomiast mówi o sytuacji

<p class="klasa-margines">Bla bla bla</p>
<p class="klasa-margines">Bla bla bla</p>
<p class="klasa-margines">Bla bla bla</p>
<p class="klasa-margines">Bla bla bla</p>
<p class="klasa-margines">Bla bla bla</p>
<p class="klasa-margines">Bla bla bla</p>
<p class="klasa-margines">Bla bla bla</p>
<p class="klasa-margines">Bla bla bla</p>

Edytowane 17 Sierpnia 2006 przez czeski_lodz

[Gość]

Ty mowisz o odleglosci miedzy wierszami.. akapity to nie wiersze, a autor chcial odleglosc miedzy akapitami, a nie wierszami.

Edytowane 17 Sierpnia 2006 przez FiDO

[czeski_lodz]

napisałem przecież, o jakiej sytuacji ty mówiłeś (na samym końcu jakbyś nie zauważył)

Edytowane 17 Sierpnia 2006 przez czeski_lodz

[ULLISSES]

Zamiast znacznika P można stosować DIV - wtedy domyślnie odstęp jest taki, jak między liniami.

W przypadku DIV można ustalić dowolne marginesy (margin-top, -bottom), które przekładają się na odległości między akapitami. Nie wiem, jak się to ma (margin) do znacznika P, bo go nie używam. :]

[Gość]

Tym mnie zmyliles:

 

Nie wiem co skopałeś w kodzie ale

text-height: wartość;

jest odpowiedzialna za odległość między akapitami i nie ma innej możliwości.

Poza tym nie ma czegos takiego jak text-height, zapewne miales na mysli line-height, czyli wysokosc linii i to faktycznie okresla odleglosc miedzy wierszami.

[czeski_lodz]

Masz rację - to są skutki pisania po imprezie, ty wiesz co chcesz powiedzieć, ale czy ktoś to zrozumie to inna sprawa :-P

[thunder_pl]

czeski_lodz, sprawdziłem to co napisałeś. Umieszczając w CSS

p.zwieksz-odstep {	text-height: 14px;}

a potem przypisując danemu akapitowi atrybut

class="zwieksz-odstep"

nie było żadnej róznicy niż jakbym dał w

body { line-height: 14px; }

czyli robią się odstępy między wierszami, a nie akapitami

 

Ulisses: co do DIV masz rację, że odstęp jest wtedy taki jak między wierszami, jednak też jest on nie do regulowania. Co gorsze, przy dużych ilościach tekstu, zamienianie <p> na <div> byłoby męczące.

 

Ale mimo wszystko, czy jeżeli było by <div> zamiast <p> to można w jakiś sposób regulować wtedy odległość? Napewno nie poprzez margin top/bottom, bo sprawdzałem

Edytowane 18 Sierpnia 2006 przez thunder_pl

[czeski_lodz]

Fido ci napisał że musisz to zrobić nie z line-height tylko z marginesem czyli

<style>
p.zwieksz-odstep {

   margin-top: wartość;
   margin-bottom: wartość;

}
</style>

<!-- a potem -->

<p class="zwieksz-odstep">treść</p>
<p class="zwieksz-odstep">treść</p>
<p class="zwieksz-odstep">treść</p>
<p class="zwieksz-odstep">treść</p>
<p class="zwieksz-odstep">treść</p>
<p class="zwieksz-odstep">treść</p>

 

A ja za zbyt pospieszne przeczytanie przepraszam :rolleyes:

Edytowane 18 Sierpnia 2006 przez czeski_lodz

[ULLISSES]

Ulisses: co do DIV masz rację, że odstęp jest wtedy taki jak między wierszami, jednak też jest on nie do regulowania. Co gorsze, przy dużych ilościach tekstu, zamienianie <p> na <div> byłoby męczące.

 

Ale mimo wszystko, czy jeżeli było by <div> zamiast <p> to można w jakiś sposób regulować wtedy odległość? Napewno nie poprzez margin top/bottom, bo sprawdzałem

Do zamiany przy dużej ilości tekstu, to używa się przecież dobrego edytora (opcja: znajdź i zastąp).

 

Jeśli strona jest w XHTML, to zmiana z P na DIV nie zmusi Cię do wywalania atrybutów P, gdyż powinny się one znajdować w arkuszu styli. Obok nazwy znacznika powinno znajdować się jedynie ID/CLASS. Reszta ma być w arkuszu. No chyba, że stusujesz tymczasową zmianę stylu w danym miejscu. To jednak można zrobić przez odpowiednią klasę lub id w arkuszu.

 

Margin-top, margin-bottom działa. Nie jest to jednak atrybut dla DIV, lecz dla klasy/id, więc musi być umieszczony w arkuszu styli.

 

Polecam zobaczyć źródła strony http://www.agro-turystyka.ovh.org (strona robiona przeze mnie). Tam widać, jak należy używać styli. Nie jest idealnie, ale jednak widać, iż cały opis wyglądu strony znajduje się w arkuszu styli, natomiast w kodzie xhtml znajduje się niezbędne minimum. W wyniku tego można całkowicie zmienić wygląd strony podmieniając jedynie arkusz styli.

Edytowane 18 Sierpnia 2006 przez ULLISSES

[thunder_pl]

a to Ci! Ulisses zanim odpowiem, powiem, że coś się stało z forum, bo Twój post ma taką treść:

Do zamiany przy dużej ilości tekstu, to używa się przecież dobrego edytora (opcja: znajdź i zastąp).

 

Jeśli strona jest w XHTML, to zmiana z P na DIV nie zmusi Cię do wywalania atrybutów P, gdyż powinny się one znajdować w arkuszu styli. Obok nazwy znacznika powinno znajdować się jedynie ID/CLASS. Reszta ma być w arkuszu. No chyba, że stusujesz tymczasową zmianę stylu w danym miejscu. To jednak można zrobić przez odpowiednią klasę lub id w arkuszu.

 

Margin-top, margin-bottom działa. Nie jest to jednak atrybut dla DIV, lecz dla klasy/id, więc musi być umieszczony w arkuszu styli.

a jak dałem "odpisz" to w edytorze pojawiło mi się to:

Do zamiany przy dużej ilości tekstu, to używa się przecież dobrego edytora (opcja: znajdź i zastąp).

 

Jeśli strona jest w XHTML, to zmiana z P na DIV nie zmusi Cię do wywalania atrybutów P, gdyż powinny się one znajdować w arkuszu styli. Obok nazwy znacznika powinno znajdować się jedynie ID/CLASS. Reszta ma być w arkuszu. No chyba, że stusujesz tymczasową zmianę stylu w danym miejscu. To jednak można zrobić przez odpowiednią klasę lub id w arkuszu.

 

Margin-top, margin-bottom działa. Nie jest to jednak atrybut dla DIV, lecz dla klasy/id, więc musi być umieszczony w arkuszu styli.

 

Polecam zobaczyć źródła strony http://www.agro-turystyka.ovh.org (strona robiona przeze mnie). Tam widać, jak należy używać styli. Nie jest idealnie, ale jednak widać, iż cały opis wyglądu strony znajduje się w arkuszu styli, natomiast w kodzie xhtml znajduje się niezbędne minimum. W wyniku tego można całkowicie zmienić wygląd strony podmieniając jedynie arkusz styli.

Dlaczego ten ostatni akapit jest tylko w edytorze, a normalnie na topicu go nie ma?

 

--------

 

a co do akapitów, to margin dawałem normalnie CSS, nie do DIV i nie działa :/

[samm-ur]

Dlaczego ten ostatni akapit jest tylko w edytorze, a normalnie na topicu go nie ma?

Ponieważ ostatni akapit ULLISSES dodał w czasie gdy Ty kliknąłes Odpisz??

Ja widzę wersję wyedytowaną.

 

a co do akapitów, to margin dawałem normalnie CSS, nie do DIV i nie działa :/

A odniośnie akapitów to może podaj kawałek kodu ew. jakiegoś screena jak byś chciał żeby to wyglądało, bo coś mi się wydaje że Ty nadajesz na innych częstotliwościach niż my odbieramy :D

 

Jeżeli prawidłowo zastosujesz te marginesy, jak Ci radzili FiDO i czeski_lodz to musi działać.

Choć ja bym uważał ze stosowaniem marginesów górnych i dolnych jednocześnie bo w rezultacie możesz uzyskać odstęp dwa razy większy niż planowałeś (margin-top i margin-bottom się sumują, a margin-right i margin-left się "nakładają"

Ale skucha, oczywiście powinno być na odwrót

margin-left i margin-right się sumują, a margin-top i margin-bottom się "nakładają", tzw. zapadanie się marginesów).

Dobrze że nikt nie zauważył B-)

 

@ULLISSES

Zmiana <p> na <div> to IMO raczej nie ma sansu, ponieważ dokładnie te same właściwości możesz zastosować dla tych selektorów.

Edytowane 18 Sierpnia 2006 przez samm-ur

[thunder_pl]

www.wygoda.pl/1/ppp.php

 

niech ktoś ściągnie sobie ten pliczek i najpierw spróbuje samemu to zrobić, a potem niech coś napisze ;)

 

PS. oczywiscie CSS samemu trzeba zrobić ;P

Edytowane 18 Sierpnia 2006 przez thunder_pl

[czeski_lodz]

proszę

z marginesem ustawionym na 50 px

Popieram samm-ur'a kilka osób zaczęło tu ostro motać, jeszcze brakowało mi kogoś kto zacznie gadać o konwencji separacji kodu od treści w xhtmlu.

Edytowane 18 Sierpnia 2006 przez czeski_lodz

[samm-ur]

www.wygoda.pl/1/ppp.php

 

niech ktoś ściągnie sobie ten pliczek i najpierw spróbuje samemu to zrobić, a potem niech coś napisze ;)

 

PS. oczywiscie CSS samemu trzeba zrobić ;P

Dobra, tak na szybko:

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><style>.CON { padding: 20px; }p { margin-bottom: 45px; line-height: 12px; }</style></head><body><div class="CON"><p>xmfnjdf msdf nmdb sm,bfdfmnsb df,jbasdn dsnmbas,dmfnmd asdf sdf b , bmbm bm, b , ,bm ,b mbds m,nb nbmdf </p><p>v sdfa asdf asdf asdfasdfdasfsdfadasf asdf sadnm msndb nsd asd v v,mcvb m,xc b,m xcv,m bvm xcv,mbcxb cxb xcv xcvmxc,vmxcvmbxcv,bxcbxc,vmbxcvbxcvmbxcb xcvb xcvmbxcvbxcmbxcvxcxcvbxcb cvbxcvbx v sdfa asdf asdf asdfasdfdasfsdfadasf asdf sadnm msndb nsd asd v v,mcvb m,xc b,m xcv,m bvm xcv,mbcxb cxb xcv xcvmxc,vmxcvmbxcv,bxcbxc,vmbxcvbxcvmbxcb xcvb xcvmbxcvbxcmbxcvxcxcvbxcb cvbxcvbx v sdfa asdf asdf asdfasdfdasfsdfadasf asdf sadnm msndb nsd asd v v,mcvb m,xc b,m xcv,m bvm xcv,mbcxb cxb xcv xcvmxc,vmxcvmbxcv,bxcbxc,vmbxcvbxcvmbxcb xcvb xcvmbxcvbxcmbxcvxcxcvbxcb cvbxcvbx </p><p>v sdfa asdf asdf asdfasdfdasfsdfadasf asdf sadnm msndb nsd asd v v,mcvb m,xc b,m xcv,m bvm xcv,mbcxb cxb xcv xcvmxc,vmxcvmbxcv,bxcbxc,vmbxcvbxcvmbxcb xcvb xcvmbxcvbxcmbxcvxcxcvbxcb cvbxcvbx v sdfa asdf asdf asdfasdfdasfsdfadasf asdf sadnm msndb nsd asd v v,mcvb m,xc b,m xcv,m bvm xcv,mbcxb cxb xcv xcvmxc,vmxcvmbxcv,bxcbxc,vmbxcvbxcvmbxcb xcvb xcvmbxcvbxcmbxcvxcxcvbxcb cvbxcvbx v sdfa asdf asdf asdfasdfdasfsdfadasf asdf sadnm msndb nsd asd v v,mcvb m,xc b,m xcv,m bvm xcv,mbcxb cxb xcv xcvmxc,vmxcvmbxcv,bxcbxc,vmbxcvbxcvmbxcb xcvb xcvmbxcvbxcmbxcvxcxcvbxcb cvbxcvbx  </p></div></body></html>

Jak nie oto chodziło te ja się poddaję.

 

EDIT.

czeski_lodz mnie ubiegł, a tak się starałem :lol:

Edytowane 18 Sierpnia 2006 przez samm-ur

[ULLISSES]

W sumie (jak się tak zastanowić), to rzeczywiście zamiana P na DIV nie ma sensu. Zaproponowałem to, bo nie wiedziałem, czy dla P można ustawiać te wszystkie opcje, które działają na DIV.

 

Odnośnie zaś tego przykładu, to chyba użyłeś złego kodowania. Używa się ISO-8859-2, a ostatnio zaleca się UFT-8.

[thunder_pl]

W sumie (jak się tak zastanowić), to rzeczywiście zamiana P na DIV nie ma sensu. Zaproponowałem to, bo nie wiedziałem, czy dla P można ustawiać te wszystkie opcje, które działają na DIV.

 

Odnośnie zaś tego przykładu, to chyba użyłeś złego kodowania. Używa się ISO-8859-2, a ostatnio zaleca się UFT-8.

to było zrobione na szybko w dreamwaverze, bo nie chciało mi się pisać w notatniku ;)

 

-----

 

Ulisses, czeski_lodz, samm-ur, FiDo, dzięki za wysiłek, myślałem, że już się nie uda rozwiązać tego problemu

Edytowane 18 Sierpnia 2006 przez thunder_pl