/ Forside / Teknologi / Udvikling / HTML / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
HTML
#NavnPoint
molokyle 11184
Klaudi 5506
bentjuul 3377
severino 2040
smorch 1950
strarup 1525
natmaden 1396
scootergr.. 1320
e.c 1150
10  miritdk 1110
Ordnet liste med "§" (paragraf) som præfix~
Fra : Peter Westh


Dato : 27-06-05 18:47

Jeg er ved at lave et site for en forening, hvor foreningens vedtægter
blandt andet skal fremgå.

Vedtægterne består af et antal nummererede paragraffer, og jeg ville gerne
lave dem som en ordnet liste <ol> som følger:

§1 bla
§2 bla bla
§3 bla bla bla

etc.

Kan det lade sig gøre med CSS eller på anden måde?

Det bedste jeg indtil videre er kommet op med er at lægge "§"-tegnet i en
baggrundsgif på den enkelte <li>, men det er ikke optimalt, blandt andet dur
det jo ikke til udskrift.

P.F. tak

Peter Westh




 
 
Allan Vebel (27-06-2005)
Kommentar
Fra : Allan Vebel


Dato : 27-06-05 19:59

Peter Westh <pwesth@fjern.hum.ku.dk> skrev:

> at lægge "§"-tegnet i en baggrundsgif på den enkelte
> <li>, men det er ikke optimalt, blandt andet dur det jo
> ikke til udskrift.

Det fungerer fint på udskriften med:

..paragraf{
list-style: url(billeder/paragraf.gif)
}

og

<ul class="paragraf">
<li>1 bla</li>
<li>2 bla bla</li>
<li>2 bla bla bla</li>
</ul>

Prøv med Vis udskrift... på http://html-faq.dk/links.asp

--
Allan Vebel
http://html-faq.dk



Peter Westh (27-06-2005)
Kommentar
Fra : Peter Westh


Dato : 27-06-05 21:32

"Allan Vebel" <spam@do.not> skrev i en meddelelse
news:42c04c9e$0$18639$14726298@news.sunsite.dk...
> Peter Westh <pwesth@fjern.hum.ku.dk> skrev:
>
>> at lægge "§"-tegnet i en baggrundsgif på den enkelte
>> <li>, men det er ikke optimalt, blandt andet dur det jo
>> ikke til udskrift.
>
> Det fungerer fint på udskriften med:
>
> .paragraf{
> list-style: url(billeder/paragraf.gif)

Ja okay, man kan lave det som en Uordnet liste i stedet for en ordnet, og så
skrive nummereringen "i hånden"...

Jeg har selv lige opdaget en anden løsning: Man kan lave en Definition
List. Det er lidt besværligt, men giver total frihed og total orden:

<dl>
<di><dt>§1</dt>
<dd>bla</dd></di>
<di><dt>§2</dt>
<dd>bla bla</dd></di>
<di><dt>§3</dt>
<dd>bla bla bla</dd></di>
</dl>

etc.

Tak for hjælpen!

/Peter



Frank (28-06-2005)
Kommentar
Fra : Frank


Dato : 28-06-05 12:56

Peter Westh skrev:
> ...
>
> Jeg har selv lige opdaget en anden løsning: Man kan lave en Definition
> List. Det er lidt besværligt, men giver total frihed og total orden:
>
> <dl>
> <di><dt>§1</dt>
> <dd>bla</dd></di>
> <di><dt>§2</dt>
> <dd>bla bla</dd></di>
> <di><dt>§3</dt>
> <dd>bla bla bla</dd></di>
> </dl>
>
> etc.
> ...

Ja den er fristende! Desværre er <di> elementet (definition item) stadigvæk
kun et forslag til xhtml 2.0, og understøttes næppe af ret mange browsere :)

mvh
Frank

Peter Westh (28-06-2005)
Kommentar
Fra : Peter Westh


Dato : 28-06-05 15:03

"Frank" <fo-NOSP@M-tdcspace.dk> skrev i en meddelelse
news:42c13ae1$0$88530$edfadb0f@dread14.news.tele.dk...
> Ja den er fristende! Desværre er <di> elementet (definition item)
> stadigvæk
> kun et forslag til xhtml 2.0, og understøttes næppe af ret mange browsere
> :)

Ja, det opdagede jeg da jeg forsøgte at validere siden! Men heldigvis
fungerer det også uden <di>:

<dl>
<dt>§1</dt>
<dd>bla</dd>
<dt>§2</dt>
<dd>bla bla</dd>
<dt>§3</dt>
<dd>bla bla bla</dd>
</dl>

Hvis man vil have <dt> og <dd> til at stå på samme linje skal man så flytte
lidt på <dd> vha css - jeg fik det til at passe med "margin-top:-1.2em;"

/Peter



Frank (29-06-2005)
Kommentar
Fra : Frank


Dato : 29-06-05 17:06

Peter Westh skrev:
> ...
> Ja, det opdagede jeg da jeg forsøgte at validere siden! Men heldigvis
> fungerer det også uden <di>:
>
> <dl>
> <dt>§1</dt>
> <dd>bla</dd>
> <dt>§2</dt>
> <dd>bla bla</dd>
> <dt>§3</dt>
> <dd>bla bla bla</dd>
> </dl>
>
> Hvis man vil have <dt> og <dd> til at stå på samme linje skal man så flytte
> lidt på <dd> vha css - jeg fik det til at passe med "margin-top:-1.2em;"
>
> ...

Ja, men det er nu lidt synd at skulle undvære den automatiske nummerering som en
<ol> gi'r... Så, hvad med denne:

<ol>
<li><span>§</span>bla</li>
<li><span>§</span>bla</li>
<li><span>§</span>bla</li>
</ol>

og noget i denne stil i CSS:

ol span {position:relative;left:-2em;}

ser sådan ud:
§1. bla
§2. bla
§3. bla

pga den relative positionering, får du mere whitespace mellem "§1." og "bla",
men det er måske til at leve med... og det virker fint i både IE og Moz.

mvh
Frank

Søg
Reklame
Statistik
Spørgsmål : 177560
Tips : 31968
Nyheder : 719565
Indlæg : 6408943
Brugere : 218888

Månedens bedste
Årets bedste
Sidste års bedste