/ 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
Udfordring: li med varabelt nr og med prik~
Fra : Leif Neland


Dato : 04-04-11 11:02

En udfordring til "alt kan laves i css"-folkene:
Lav menukortet som en OL

1 Varenavn .......................123
2 Anden vare.......................56
4 Fjerde vare......................20


Html'en ca:

<OL>
<LI>Varenavn<span>123</span></LI>
--
<LI value=4>Fjerde vare<span>20</span></li>
.....
</OL>

Og hvad er så css'en?

Leif




 
 
Jens Peter Karlsen (04-04-2011)
Kommentar
Fra : Jens Peter Karlsen


Dato : 04-04-11 14:44

Hvad du har beskrevet er "kun" html, så hvad havde du forestillet dig
at der skulle gøres med CSS?

Regards Jens Peter Karlsen.

On Mon, 4 Apr 2011 12:02:06 +0200, "Leif Neland" <leif@neland.dk>
wrote:

>En udfordring til "alt kan laves i css"-folkene:
>Lav menukortet som en OL

Karl Erik Christense~ (04-04-2011)
Kommentar
Fra : Karl Erik Christense~


Dato : 04-04-11 15:03

On 04-04-2011 12:02, Leif Neland wrote:
> En udfordring til "alt kan laves i css"-folkene:
> Lav menukortet som en OL
>
> 1 Varenavn .......................123
> 2 Anden vare.......................56
> 4 Fjerde vare......................20
>
>
> Html'en ca:
>
> <OL>
> <LI>Varenavn<span>123</span></LI>
> --
> <LI value=4>Fjerde vare<span>20</span></li>
> ....
> </OL>
>
> Og hvad er så css'en?
>
> Leif
>

Hvis dit eksempel skal forstås som du ønsker at springe over 3 - hvorfor
dog det? Det har aldrig været meningen med ol, som netop betyder
"ordered list".

Du kan dog bruge f.eks. php til at definere talrækken.

Karl Erik.

--
http://dmwebdesign.dk - DM i Webdesign
http://www.tyveri-check.dk - Snyd tyven før han snyder dig!
http://webdesign.ranunkelvej.com - Artikler om webdesign


Karl Erik Christense~ (04-04-2011)
Kommentar
Fra : Karl Erik Christense~


Dato : 04-04-11 17:05

On 04-04-2011 16:03, Karl Erik Christensen wrote:

> Hvis dit eksempel skal forstås som du ønsker at springe over 3 - hvorfor
> dog det? Det har aldrig været meningen med ol, som netop betyder
> "ordered list".
>
> Du kan dog bruge f.eks. php til at definere talrækken.
>
> Karl Erik.
>

Eller er det prikkerne du mener?

HTML kan hverken regne eller regere. Det kan php derimod:

linielængde = 50;
antal_prikker = linielængde-varetekst;
Echo"varetekst, antal_prikker";

Så kan du selv sætte syntaks mv.

Karl Erik.

--
http://dmwebdesign.dk - DM i Webdesign
http://www.tyveri-check.dk - Snyd tyven før han snyder dig!
http://webdesign.ranunkelvej.com - Artikler om webdesign


Sune Storgaard (04-04-2011)
Kommentar
Fra : Sune Storgaard


Dato : 04-04-11 17:28

Den 04-04-2011 18:05, Karl Erik Christensen skrev:

> HTML kan hverken regne eller regere. Det kan php derimod:
>
> linielængde = 50;
> antal_prikker = linielængde-varetekst;
> Echo"varetekst, antal_prikker";
>
> Så kan du selv sætte syntaks mv.

Om det er UL eller OL gør vist ikke den store forskel i problemts kerne.

Man skal naturligvis have en lige højre margin, så i det regnestykke
skal antal_bogstaver_i_prisen også modregnes prikker. Det er nu
matematik på et moderat plan..
Værre er det at ,. og mellemrum ikke fylder lige meget, på tværs af
skriftyper og størrelser osv
.....................
,,,,,,,,,,,,,,,,,,,,
XXXXXXXXXXXXXXXXXXXX

... med mindre det er fixed bredde font, som sjældent vinder nogen
designer priser, men det kan være en pille man må sluge.

Med css kunne man rode sig ud i noget "småfusk" med border-bottom:dotted
1px black , problemet er så bare at man godt kan komme til at klippe et
punktum over. Igen kommer i problemer med højremarginen, hvis priserne
har forskellig længde -hvad man må antage er muligt-

Jeg har ikke set nogen optimal løsning på problemet, der ikke involverer
en hæl eller tå,men jeg er ligesom Leif nysgerrig.





Leif Neland (06-04-2011)
Kommentar
Fra : Leif Neland


Dato : 06-04-11 08:10


"Karl Erik Christensen" <karlerik@none.invalid.com> skrev i en meddelelse
news:4d99cf9e$0$23765$14726298@news.sunsite.dk...
> On 04-04-2011 12:02, Leif Neland wrote:
>> En udfordring til "alt kan laves i css"-folkene:
>> Lav menukortet som en OL
>>
>> 1 Varenavn .......................123
>> 2 Anden vare.......................56
>> 4 Fjerde vare......................20
>>
>>
>> Html'en ca:
>>
>> <OL>
>> <LI>Varenavn<span>123</span></LI>
>> --
>> <LI value=4>Fjerde vare<span>20</span></li>
>> ....
>> </OL>
>>
>> Og hvad er så css'en?
>>
>> Leif
>>
>
> Hvis dit eksempel skal forstås som du ønsker at springe over 3 - hvorfor
> dog det? Det har aldrig været meningen med ol, som netop betyder "ordered
> list".
>
Fordi vare nr 3 er udgået.




Bertel Lund Hansen (06-04-2011)
Kommentar
Fra : Bertel Lund Hansen


Dato : 06-04-11 08:33

Leif Neland skrev:

>> Hvis dit eksempel skal forstås som du ønsker at springe over 3 - hvorfor
>> dog det? Det har aldrig været meningen med ol, som netop betyder "ordered
>> list".

> Fordi vare nr 3 er udgået.

I dit sted ville jeg ikke springe nummer 3 over.

--
Bertel
http://bertel.lundhansen.dk/      http://fiduso.dk/

Leif Neland (06-04-2011)
Kommentar
Fra : Leif Neland


Dato : 06-04-11 22:02

Den 06-04-2011 09:33, Bertel Lund Hansen skrev:
> Leif Neland skrev:
>
>>> Hvis dit eksempel skal forstås som du ønsker at springe over 3 - hvorfor
>>> dog det? Det har aldrig været meningen med ol, som netop betyder "ordered
>>> list".
>
>> Fordi vare nr 3 er udgået.
>
> I dit sted ville jeg ikke springe nummer 3 over.
>

Det vil da give rod i køkkenet, når en nr 27 pludselig er en nr 26

Leif


--
Bevar P2, luk P3, der er nok P3'er i forvejen.

Bertel Lund Hansen (06-04-2011)
Kommentar
Fra : Bertel Lund Hansen


Dato : 06-04-11 22:38

Leif Neland skrev:

>>> Fordi vare nr 3 er udgået.

>> I dit sted ville jeg ikke springe nummer 3 over.

> Det vil da give rod i køkkenet, når en nr 27 pludselig er en nr 26

Du misforstår. Jeg ville skrive at vare nr. 3 er udgået. Jeg går
ud fra det er til nogen kunder, og de skal da vide at de ikke
længere kan bestille Skipper Skræk-hæfter (eller hvad du nu
sælger).

--
Bertel
http://bertel.lundhansen.dk/      http://fiduso.dk/

Allan Vebel (06-04-2011)
Kommentar
Fra : Allan Vebel


Dato : 06-04-11 22:54

Bertel Lund Hansen skrev:

> Jeg ville skrive at vare nr. 3 er udgået. Jeg går
> ud fra det er til nogen kunder, og de skal da vide
> at de ikke længere kan bestille Skipper Skræk-
> hæfter (eller hvad du nu sælger).

Det kommer jo an på hvad det er, og hvor mange
varer der er udgået.

Kommer jeg ind på en pizzaria (hvilket jeg meget
sjældent gør), og ser på listen at halvdelen af
varerne er udgået, kommer jeg nok ikke der igen.

Det skal være kort og præsist og nemt at
overskue.

Er det en lang række varenumre på en side på
nettet, er det en anden sag - her kan det godt være
på sin plads at skilte med hvilke varenumre der
ikke sælges mere.

--
Allan Vebel
http://vebel.dk | http://dmwebdesign.dk


Leif Neland (06-04-2011)
Kommentar
Fra : Leif Neland


Dato : 06-04-11 23:08

Den 06-04-2011 23:54, Allan Vebel skrev:
> Bertel Lund Hansen skrev:
>
>> Jeg ville skrive at vare nr. 3 er udgået. Jeg går
>> ud fra det er til nogen kunder, og de skal da vide
>> at de ikke længere kan bestille Skipper Skræk-
>> hæfter (eller hvad du nu sælger).
>
> Det kommer jo an på hvad det er, og hvor mange
> varer der er udgået.
>

Det kunne jo også tænkes at pizza var 1-22, pasta 30-45 og desserter
70-75, for at have plads til udvidelser

Leif




--
Bevar P2, luk P3, der er nok P3'er i forvejen.

Kurt Hansen (07-04-2011)
Kommentar
Fra : Kurt Hansen


Dato : 07-04-11 05:29

Wed, 6 Apr 2011 23:54:18 +0200 skrev Allan Vebel:

>Bertel Lund Hansen skrev:
>
>> Jeg ville skrive at vare nr. 3 er udgået. Jeg går
>> ud fra det er til nogen kunder, og de skal da vide
>> at de ikke længere kan bestille Skipper Skræk-
>> hæfter (eller hvad du nu sælger).
>
>Det kommer jo an på hvad det er, og hvor mange
>varer der er udgået.
>
>Kommer jeg ind på en pizzaria (hvilket jeg meget
>sjældent gør), og ser på listen at halvdelen af
>varerne er udgået, kommer jeg nok ikke der igen.

Hvilken glæde ville jeg have at at kunne se, at de engang har haft en
pizza med makrelsalat og Nutella på programmet?
--
Venlig hilsen
Kurt Hansen

Birger Sørensen (04-04-2011)
Kommentar
Fra : Birger Sørensen


Dato : 04-04-11 17:36

Leif Neland forklarede den 04-04-2011:
> En udfordring til "alt kan laves i css"-folkene:
> Lav menukortet som en OL
>
> 1 Varenavn .......................123
> 2 Anden vare.......................56
> 4 Fjerde vare......................20
>
>
> Html'en ca:
>
> <OL>
> <LI>Varenavn<span>123</span></LI>

Leger stadig, men...

Ren HTML og css:
http://bbsorensen.com/test/ol/

Birger

--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk



Sune Storgaard (04-04-2011)
Kommentar
Fra : Sune Storgaard


Dato : 04-04-11 17:55

Den 04-04-2011 18:36, Birger Sørensen skrev:
> Leger stadig, men...
>
> Ren HTML og css:
> http://bbsorensen.com/test/ol/
God løsning, men der bliver klippet punktummer over. Man kan måske rode
lidt med det til at det lige rammer så tydeligt.Ikke just nogen
katastrofe, men der røg en lilletå :)

Birger Sørensen (04-04-2011)
Kommentar
Fra : Birger Sørensen


Dato : 04-04-11 19:13

Den 04-04-2011, skrev Sune Storgaard:
> Den 04-04-2011 18:36, Birger Sørensen skrev:
>> Leger stadig, men...
>>
>> Ren HTML og css:
>> http://bbsorensen.com/test/ol/
> God løsning, men der bliver klippet punktummer over. Man kan måske rode lidt
> med det til at det lige rammer så tydeligt. Ikke just nogen katastrofe, men
> der røg en lilletå :)

Problemet er vel nærmere kommentarerne, der nogen gange fylder ned på
næste linie. Der er nødt til at deles manuelt, og det bliver ikke
specielt vedligeholdelsesvenligt.
Et alternativ kan være altid at give dem en ekstra linie - eller i
hvert fald dem der ikke kan være samlet linien.
Har tilføjet lidt, også med almindeligt HTML - altså uden <ol>, som vel
egentlig er overflødig - her har jeg så ersattet den store dot med en
mindre, der ikke kan hugges over ^^ .

Egentlig er der vel tale om tabulære data, så en tabel vil være i
orden, for det enkelte afsnit. Det giver så til gengæld problemer med
dottene, og specielt kommentarerne.
Man kan bruge samme teknik, og have dots som baggrund i td'er, og blot
overskrive dem med tekstfelter som uden tabellen. Har lidt en
fornemmelse af at det bliver mere kompliceret, end blot at holde det
som div'er.

Birger

--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk



Allan Vebel (04-04-2011)
Kommentar
Fra : Allan Vebel


Dato : 04-04-11 21:19

Leif Neland skrev:

> 1 Varenavn .......................123
> 2 Anden vare.......................56
> 4 Fjerde vare......................20

Jeg har lavet en simpel en her:

http://vebel.dk/test/liste-med-prikker/

--
Allan Vebel
http://vebel.dk | http://dmwebdesign.dk


Karl Erik Christense~ (04-04-2011)
Kommentar
Fra : Karl Erik Christense~


Dato : 04-04-11 21:26

On 04-04-2011 22:18, Allan Vebel wrote:
> Leif Neland skrev:
>
>> 1 Varenavn .......................123
>> 2 Anden vare.......................56
>> 4 Fjerde vare......................20
>
> Jeg har lavet en simpel en her:
>
> http://vebel.dk/test/liste-med-prikker/
>

Du mangler:

5 Selvlysende shusi fra Japan ..........Gratis for de modige

Karl Erik.

--
http://dmwebdesign.dk - DM i Webdesign
http://www.tyveri-check.dk - Snyd tyven før han snyder dig!
http://webdesign.ranunkelvej.com - Artikler om webdesign


Allan Vebel (04-04-2011)
Kommentar
Fra : Allan Vebel


Dato : 04-04-11 22:24

Karl Erik Christensen skrev:

> 5 Selvlysende shusi fra Japan ..........

Jamen, så må vi også have den med - det
smager jo strålende

--
Allan Vebel
http://vebel.dk | http://dmwebdesign.dk


Kurt Hansen (05-04-2011)
Kommentar
Fra : Kurt Hansen


Dato : 05-04-11 04:17

Mon, 04 Apr 2011 22:26:11 +0200 skrev Karl Erik Christensen:

>On 04-04-2011 22:18, Allan Vebel wrote:
>> Leif Neland skrev:
>>
>>> 1 Varenavn .......................123
>>> 2 Anden vare.......................56
>>> 4 Fjerde vare......................20
>>
>> Jeg har lavet en simpel en her:
>>
>> http://vebel.dk/test/liste-med-prikker/
>>
>
>Du mangler:
>
>5 Selvlysende shusi fra Japan ..........Gratis for de modige

Konkurrencen spidser til. Danske svin, der strutter af penicillin, har
ellers haft markedet for sig selv i mange år.
--
Venlig hilsen
Kurt Hansen

Leif Neland (04-04-2011)
Kommentar
Fra : Leif Neland


Dato : 04-04-11 22:51

Den 04-04-2011 22:18, Allan Vebel skrev:
> Leif Neland skrev:
>
>> 1 Varenavn .......................123
>> 2 Anden vare.......................56
>> 4 Fjerde vare......................20
>
> Jeg har lavet en simpel en her:
>
> http://vebel.dk/test/liste-med-prikker/
>

Du mangler at nr 3 er udgået.

Men <li value=4> er "depreciated", men er der noget alternativ, og det
ser da ud til at virke... Kan det mon blive re-appriciated (sp?) igen,
hvis der ikke er et alternativ?

Leif
--
Bevar P2, luk P3, der er nok P3'er i forvejen.

Bertel Lund Hansen (05-04-2011)
Kommentar
Fra : Bertel Lund Hansen


Dato : 05-04-11 23:14

Leif Neland skrev:

> Men <li value=4> er "depreciated", men er der noget alternativ, og det
> ser da ud til at virke...

Jeg har benyttet den mulighed på en af mine undersider. Jeg kan
ikke se hvorfor man vil fjerne den mulighed.

Den side er opbygget med en beskrivelse i nummererede punkter
afbrudt af længere forklaringer som ikke kan tildeles et nummer.

Siden er her:

http://bertel.lundhansen.dk/?page=irfanview/picturesize&m=I

Jeg synes ikke der er noget galt med den måde at stille tingene
op på. Jeg kunne godt indlejre det le ei en ydre liste - men det
vil alligevel ikke give underpunkterne fortløbende numre som de
skal have.

Og det kan da ikke passe at man skal være tvunget til serverside
scripting med en statisk side.

--
Bertel
http://bertel.lundhansen.dk/      http://fiduso.dk/

Kurt Hansen (05-04-2011)
Kommentar
Fra : Kurt Hansen


Dato : 05-04-11 04:20

Mon, 4 Apr 2011 22:18:57 +0200 skrev Allan Vebel:

>Leif Neland skrev:
>
>> 1 Varenavn .......................123
>> 2 Anden vare.......................56
>> 4 Fjerde vare......................20
>
>Jeg har lavet en simpel en her:
>
>http://vebel.dk/test/liste-med-prikker/

Af ren og skær nysgerrighed: Hvorfor pakker du det ind i en DIV?
--
Venlig hilsen
Kurt Hansen

Allan Vebel (05-04-2011)
Kommentar
Fra : Allan Vebel


Dato : 05-04-11 12:20

Kurt Hansen skrev:

> Af ren og skær nysgerrighed: Hvorfor pakker
> du det ind i en DIV?

Som du kan se, hedder den #indhold - det er
for at gøre det muligt at give body en baggrund
der er anderledes end #indhold, give den bredde,
centrering, border, margin, padding og hvad men
ellers kan finde på.

--
Allan Vebel
http://vebel.dk | http://dmwebdesign.dk


Sune Storgaard (06-04-2011)
Kommentar
Fra : Sune Storgaard


Dato : 06-04-11 18:10

Den 04-04-2011 22:18, Allan Vebel skrev:
> Leif Neland skrev:
>
>> 1 Varenavn .......................123
>> 2 Anden vare.......................56
>> 4 Fjerde vare......................20
>
> Jeg har lavet en simpel en her:
>
> http://vebel.dk/test/liste-med-prikker/

<små sko>
Også her kappes der punktummer, alt efter lige hvordan
zoom/skriftstørrelse er.
</små sko>
Men det er blandt de bedste løsninger på problemet.


Birger Sørensen (06-04-2011)
Kommentar
Fra : Birger Sørensen


Dato : 06-04-11 18:16

Sune Storgaard formulerede onsdag:
> Den 04-04-2011 22:18, Allan Vebel skrev:
>> Leif Neland skrev:
>>
>>> 1 Varenavn .......................123
>>> 2 Anden vare.......................56
>>> 4 Fjerde vare......................20
>>
>> Jeg har lavet en simpel en her:
>>
>> http://vebel.dk/test/liste-med-prikker/
>
> <små sko>
> Også her kappes der punktummer, alt efter lige hvordan zoom/skriftstørrelse
> er.
> </små sko>
> Men det er blandt de bedste løsninger på problemet.

Du undgår kun de ømme tæer, ved at lade dot'en være een pixel bred, som
i den løsning uden liste på
http://bbsorensen.com/test/ol/
det er ganske enkelt et spørsmål om baggrundsbilledet.
Så måske skulle du erveje, om ikke skoene *er* for små? :D

Birger

--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk



Sune Storgaard (06-04-2011)
Kommentar
Fra : Sune Storgaard


Dato : 06-04-11 20:50

Den 06-04-2011 19:16, Birger Sørensen skrev:

> Du undgår kun de ømme tæer, ved at lade dot'en være een pixel bred, som
> i den løsning uden liste på
> http://bbsorensen.com/test/ol/
> det er ganske enkelt et spørsmål om baggrundsbilledet.
> Så måske skulle du erveje, om ikke skoene *er* for små? :D

Som jeg skrev så var vi ovre i småtings afdelingen, jeg tror en
altovervejende del vil være absolut tilfreds med de løsninger der er
kommet frem herinde. Men det er trods alt usenet, man har vel lov at
være vanskelig og gå ned i bagateller..

Jeg har dog kendskab til en tåbelig sag (som jeg heldigvis ikke var en
del af), hvor netop sådanne punktummer i et trykt menukort blev gjort
til genstand for en større strid, hvor kokken,grafikeren og tilmed
trykkeriet røg i totterne på hinanden, og det endte med en dekort i
prisen på kortene, og at grafikeren vist fandt et andet sted at æde
frokost..

Mine fodboldstøvler er for små, men det er også de eneste sko jeg har
der klemmer :)

Kurt Hansen (07-04-2011)
Kommentar
Fra : Kurt Hansen


Dato : 07-04-11 05:33

Wed, 06 Apr 2011 21:49:59 +0200 skrev Sune Storgaard:

>Mine fodboldstøvler er for små, men det er også de eneste sko jeg har
>der klemmer :)

Jeg har et par sorte sko der giver mig en dundrende hovedpine. Hver
gang jeg vågner med dem på søndag morgen, har jeg det ad helvede til.
--
Venlig hilsen
Kurt Hansen

Rune Jensen (05-04-2011)
Kommentar
Fra : Rune Jensen


Dato : 05-04-11 08:01

On 4 Apr., 23:50, Leif Neland <l...@neland.dk> wrote:

> Men <li value=4> er "depreciated",

Ikke i HTML5, så det ville jeg ikke anse for et problem. For det
virker også i IE. Netop dét gør - meget andet gør ikke. Dog skal
valuen nok i citationstegn.

Man skal være opmærksom på, at value er for indhold, og må kun bruges
til indhold, men det er det da vidst også i Leifs tilfælde.


MVH
Rune Jensen

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

Månedens bedste
Årets bedste
Sidste års bedste