---

Hej.

I forbindelse med mit notes projekt, og impulser om tabeller og
baggrundsbilleder, er jeg igang med (forsøge) at definere et link vha et
baggrundsbillede i en (næsten) tom celle.

Det virker nogenlunde her:
http://w-o-p-r.dk/notes/notes.this.view.asp?databasename=Notes&viewname=Brut
toliste

Men for at 'aktivere' <a> har jeg lagt en &nbsp; ind, men selvom jeg prøver
på at specificere a tagget med en width på 16px, så er den åbenbart kun lige
så bred som &nbsp;, så man skal nærmest bruge en mikrometerskrue for at
ramme linket.

Hvordan kan man, eller kan man, fortælle at denne <a> skal være lige så stor
som den celle den indgår i ?

(Jeg har også prøvet med 100% osv., men lege meget hvad, så bliver den ikke
bredere)

--
Med venlig hilsen/Best regards
Stig Johansen

---

Stig Johansen tastede følgende:
> Hej.
>
> I forbindelse med mit notes projekt, og impulser om tabeller og
> baggrundsbilleder, er jeg igang med (forsøge) at definere et link vha et
> baggrundsbillede i en (næsten) tom celle.
>
> Det virker nogenlunde her:
> http://w-o-p-r.dk/notes/notes.this.view.asp?databasename=Notes&viewname=Brut
> toliste
>
> Men for at 'aktivere' <a> har jeg lagt en &nbsp; ind, men selvom jeg prøver
> på at specificere a tagget med en width på 16px, så er den åbenbart kun lige
> så bred som &nbsp;, så man skal nærmest bruge en mikrometerskrue for at
> ramme linket.
>
> Hvordan kan man, eller kan man, fortælle at denne <a> skal være lige så stor
> som den celle den indgår i ?
>
> (Jeg har også prøvet med 100% osv., men lege meget hvad, så bliver den ikke
> bredere)

<a> er inline og har bredde efter indhold.
prøv med
display : block;
det burde give den bredde.

Birger

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

---

Stig Johansen skrev:
> Hej.
>
> I forbindelse med mit notes projekt, og impulser om tabeller og
> baggrundsbilleder, er jeg igang med (forsøge) at definere et link vha et
> baggrundsbillede i en (næsten) tom celle.
>
> Det virker nogenlunde her:
> http://w-o-p-r.dk/notes/notes.this.view.asp?databasename=Notes&viewname=Brut
> toliste
>
> Men for at 'aktivere' <a> har jeg lagt en &nbsp; ind, men selvom jeg prøver
> på at specificere a tagget med en width på 16px, så er den åbenbart kun lige
> så bred som &nbsp;, så man skal nærmest bruge en mikrometerskrue for at
> ramme linket.
>
> Hvordan kan man, eller kan man, fortælle at denne <a> skal være lige så stor
> som den celle den indgår i ?

I hvert fald ikke med display: block-inline; Den
display-værdi er inline-block. Men kan du ikke bare
bruge display:block;? (Jeg husker det ikke nøjagtigt,
men der er vist (eller har været) problemer med
understøttelsen af inline-block).

--

Med venlig hilsen
Jørgen Farum Jensen
Håndbog i webdesign: http://webdesign101.dk/wwwbog/udgave2/
Webdesign med stylesheets: http://webdesign101.dk/cssbog/
..

---

Stig Johansen wrote:

> Hvordan kan man, eller kan man, fortælle at denne <a> skal være lige så
> stor som den celle den indgår i ?

Tak til Birger og Jørgen.

Selvom jeg smider spørgsmålet ud, så prøver jeg alligevel nogle løsninger,
så ting så måske ikke ud som ting så ud da jeg stillede spørgsmålet.

Jeg fandt imidlertid en løsning med at lægge en div inden i (med &nbsp; -
som Birger vist engang pointerede), og give denne bredden.

I forhold til vores andre snakker om samme, så skal jeg mere bruge det
(baggrundsbilleder) til ret og slet funktioner, hvor jeg ønsker at spare på
html'et, og styre ret/slet vha. javascript.

Hvis man har rettigherderne, ser det foreløbigt sådan her ud:
<http://w-o-p-r.dk/notes/view.icons.html>

Men da jeg lavede dette via 'view source', så validerer det med div i a
ikke, men det virker, så man (jeg) må overveje vigtigheden af validering
ctr. funktionalitet.

--
Med venlig hilsen
Stig Johansen

---

Stig Johansen wrote:
> Stig Johansen wrote:
>
>> Hvordan kan man, eller kan man, fortælle at denne <a> skal være lige så
>> stor som den celle den indgår i ?
>
> Tak til Birger og Jørgen.
>
> Selvom jeg smider spørgsmålet ud, så prøver jeg alligevel nogle løsninger,
> så ting så måske ikke ud som ting så ud da jeg stillede spørgsmålet.
>
> Jeg fandt imidlertid en løsning med at lægge en div inden i (med &nbsp; -
> som Birger vist engang pointerede), og give denne bredden.
>
> I forhold til vores andre snakker om samme, så skal jeg mere bruge det
> (baggrundsbilleder) til ret og slet funktioner, hvor jeg ønsker at spare på
> html'et, og styre ret/slet vha. javascript.
>
> Hvis man har rettigherderne, ser det foreløbigt sådan her ud:
> <http://w-o-p-r.dk/notes/view.icons.html>
>
> Men da jeg lavede dette via 'view source', så validerer det med div i a
> ikke, men det virker, så man (jeg) må overveje vigtigheden af validering
> ctr. funktionalitet.
>

<div style="width:200px;height:200px;">
<a style="height:200px;display:block;" href="#">Tryk</a>
</div>

Det er den eneste måde jeg kender til at få en <a> til at kunne fylde
det hele, altså at definere højden på den, også give den block, så den
fylder bredden på dens udv. makker

---

Martin skrev:

> Det er den eneste måde jeg kender til at få en <a> til at kunne fylde
> det hele, altså at definere højden på den, også give den block, så den
> fylder bredden på dens udv. makker

Denne her er bedre. Hemmeligheden er at padding hører med til
indholdet:

a {
   textdecoration: none;
   margin: 0;
   padding: 100%;
}

<div><a href='/'> </a></div>

Det er den jeg bruger på obese.dk til at vende tilbage til
hovedsiden når man har set på baggrundsbilledet.

file://localhost/D:/Hjemmesider/Obese/baggrundsbilledet.htm

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

---

Bertel Lund Hansen har bragt dette til verden:
> Martin skrev:
>
>> Det er den eneste måde jeg kender til at få en <a> til at kunne fylde
>> det hele, altså at definere højden på den, også give den block, så den
>> fylder bredden på dens udv. makker
>
> Denne her er bedre. Hemmeligheden er at padding hører med til
> indholdet:
>
> a {
>    textdecoration: none;
>    margin: 0;
>    padding: 100%;
> }
>
> <div><a href='/'> </a></div>
>
> Det er den jeg bruger på obese.dk til at vende tilbage til
> hovedsiden når man har set på baggrundsbilledet.
>
> file://localhost/D:/Hjemmesider/Obese/baggrundsbilledet.htm

Skidt link...
Mener i øvrigt at padding er mellem indhold og ramme - altså hører ikke
med til indhold.

Birger

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

---

Birger Sørensen skrev:

> Skidt link...

Øv! Det er længe siden jeg har lavet den fejl

   http://www.obese.dk/baggrundsbilledet.htm

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

---

Bertel Lund Hansen:
> Birger Sørensen skrev:
>
>> Skidt link...
>
> Øv! Det er længe siden jeg har lavet den fejl
>
>    http://www.obese.dk/baggrundsbilledet.htm

Hvorfor skulle du være bedre end os andre?

De 100% padding giver så også sikkerhed for nogle uanvendelige
scrollbarer i alle tilgængelige retninger, skulle man have lyst/brug
for det..
Jeg vil nu stadig mene, at display : block; er nok til at man kan style
sit link som der er brug for...

Birger

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

---

Birger Sørensen skrev:

> Jeg vil nu stadig mene, at display : block; er nok til at man kan style
> sit link som der er brug for...

Det plejer nu også at virke fint her.
Jeg har afprøvet det i forskellige sammenhænge og bruger det næsten
altid i menuer.

Her er <a> sat til display:block;, mens den omkringliggende <li> evt. er
sat til display: inline;.


--
Philip - http://www.chartbase.dk | http://www.hitsurf.dk

---

Birger Sørensen skrev:

> De 100% padding giver så også sikkerhed for nogle uanvendelige
> scrollbarer i alle tilgængelige retninger, skulle man have lyst/brug
> for det..

Ja, det har jeg faktisk først opdaget nu. Men hvis jeg vil have
at hele fladen - uanset vinduesstørrelse - skal være et link, kan
jeg nok ikke undgå det. Med Martins løsning giver en størrelse på
f.eks. 2000*2000 samme resultat.

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

---

Bertel Lund Hansen har bragt dette til verden:
> Birger Sørensen skrev:
>
>> De 100% padding giver så også sikkerhed for nogle uanvendelige
>> scrollbarer i alle tilgængelige retninger, skulle man have lyst/brug
>> for det..
>
> Ja, det har jeg faktisk først opdaget nu. Men hvis jeg vil have
> at hele fladen - uanset vinduesstørrelse - skal være et link, kan
> jeg nok ikke undgå det. Med Martins løsning giver en størrelse på
> f.eks. 2000*2000 samme resultat.

Nok knap så lange scrollbars - men det er da nok rigtigt.
a {
display : block;
width : 100%;
height : 100%;
}
Så er problemet bare, at body til at fylde hele vinduet - men et eller
andet sted, må det vel være godt nok, at man kan klikke billedet, og
ikke nødvendigvis det ingenting der måtte være udenom...
Måske en for stor padding-top, komboneret med oenstående...?

Birger

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

---

Birger Sørensen skrev:

> Nok knap så lange scrollbars - men det er da nok rigtigt.
> a {
> display : block;
> width : 100%;
> height : 100%;
> }

> Så er problemet bare, at body til at fylde hele vinduet -

Og så er vi tilbage til en virtuel størrelse igen.

> men et eller andet sted, må det vel være godt nok, at man kan klikke billedet, og
> ikke nødvendigvis det ingenting der måtte være udenom...

Der er ingenting udenom i min browser. Da billedet er en
baggrund, har det ingen størrelse.

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

---

Bertel Lund Hansen frembragte:
> Birger Sørensen skrev:
>
>> Nok knap så lange scrollbars - men det er da nok rigtigt.
>> a {
>> display : block;
>> width : 100%;
>> height : 100%;
>> }
>
>> Så er problemet bare, at body til at fylde hele vinduet -
>
> Og så er vi tilbage til en virtuel størrelse igen.
>
>> men et eller andet sted, må det vel være godt nok, at man kan klikke
>> billedet, og ikke nødvendigvis det ingenting der måtte være udenom...
>
> Der er ingenting udenom i min browser. Da billedet er en
> baggrund, har det ingen størrelse.

Jeg er ikke så hurtig i optrækket i dag. :/
Skru' paddingen ned til 50%. Så burde det jo være perfekt...

Birger

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

---

"Birger Sørensen" <sdc@bbsorensen.com> wrote in message
news:4b0c6b99$0$282$14726298@news.sunsite.dk...
> Bertel Lund Hansen frembragte:
> >
> > Der er ingenting udenom i min browser. Da billedet er en
> > baggrund, har det ingen størrelse.
>
> Jeg er ikke så hurtig i optrækket i dag. :/
> Skru' paddingen ned til 50%. Så burde det jo være perfekt...

He - ja, problemet er netop det med 'ingenting'.

Jeg prøvede frem og tilbage med det der padding, og det gav nogle underlige
resultater rundt omkring.

Jeg prøvede at lege med Bertels side, med lidt af hvert.

Først satte jeg absolute på div'en, så vi er ude over margins/padding på
body.
En width på 100% giver scrollbars i min FF, så den måtte reduceres.

Jeg ved ikke hvorfor, men FF skider tilsyneladende på top padding, og
nærmest fordobler i bottom.

Men det er ikke konsekvent, for ved resizing, så bliver den skiftevis for
lille og for stor, og giver scrollbars.

Ved full screen (1024x768) passer den her - nogenlunde i Bertels side:
.....
div {
position:absolute ;
width: 99%;
height: 99%;
padding: 0 ;
margin: 0;
}
a {
textdecoration: none;
margin: 0;
padding: 0 0 58% 100%;
}
.....

Det med hopperiet kan man se ved at bruge ff's webdeveloper, og vælge view
style info.

Den markerer <a>'en med en rød ramme, og hvis man lader den stå, og resizer,
ser man 'hopperiet'.

Ingen af de angivne metoder virker dog i IE6.

--
Med venlig hilsen/Best regards
Stig Johansen

---

Stig Johansen formulerede spørgsmålet:
8X
> div {
> position:absolute ;
> width: 99%;
> height: 99%;
> padding: 0 ;
> margin: 0;
> }
> a {
> textdecoration: none;
> margin: 0;
> padding: 0 0 58% 100%;
> }
8X

div {
position : absolute;
top : 0px;
right : 0px;
bottom : 0px;
left : 0px;
padding : 0px;
margin : 0px;
}
skulle vist fylde det hele, uden scrollbarer.
Et a indeni med padding 50%, burde så gøre det hele klikbart.
Ved manipulering af overflow (:hidden), skulle det vel være muligt,
også at have a'et til at fylde mere, også uden at få vist
scrollbarerne.

Birger

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

---

Birger Sørensen skrev:

> skulle vist fylde det hele, uden scrollbarer.

Jeps.

> Et a indeni med padding 50%, burde så gøre det hele klikbart.
> Ved manipulering af overflow (:hidden), skulle det vel være muligt,
> også at have a'et til at fylde mere, også uden at få vist
> scrollbarerne.

Ja. Jeg gav den 100% padding for at være sikker på at alle
browsere fik nok. Det funker i Opera og FF.

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

---

Bertel Lund Hansen har bragt dette til verden:
> Birger Sørensen skrev:
>
>> skulle vist fylde det hele, uden scrollbarer.
>
> Jeps.
>
>> Et a indeni med padding 50%, burde så gøre det hele klikbart.
>> Ved manipulering af overflow (:hidden), skulle det vel være muligt,
>> også at have a'et til at fylde mere, også uden at få vist
>> scrollbarerne.
>
> Ja. Jeg gav den 100% padding for at være sikker på at alle
> browsere fik nok. Det funker i Opera og FF.

200% er vel det samme, uanset browser?

Birger

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

---

Birger Sørensen skrev:

> 200% er vel det samme, uanset browser?

Nej. Firefox skulle have 69% i højden og 44% i bredden for at
linket fyldte hele feltet. Det gav en ulinket stribe på ca. 3 cm
i bunden af feltet i Opera.

Hvis jeg tilfredsstillede Opera, fik FF en rullebjælke.

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

---

Bertel Lund Hansen skrev:

> Da billedet er en baggrund, har det ingen størrelse.

Jo, det har da en størrelse: 1024 x 768, og det kan
du sagtens forholde dig til i din css.

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

---

Allan Vebel skrev:

> > Da billedet er en baggrund, har det ingen størrelse.

> Jo, det har da en størrelse: 1024 x 768, og det kan
> du sagtens forholde dig til i din css.

Rent teknisk optræder det i browseren som om det slet ikke er der
ud over at det pynter.

Nu har jeg droppet div'en (og dermed IE6), og skruet ned for
paddingen så der ikke optræder rullebjælker i min browser med
fuldt vindue

Opera og FF er ret uenige om hvor meget padding der skal gives i
højden. Med 80% er der link i Opera over det hele, men det giver
rullebjælke iFF. Procenten skal ned på 66 for at den forsvinder.
Så er der ikke link i den nederste stribe i Opera. Men det er nok
den løsning jeg beholder.

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

---

Bertel Lund Hansen skrev:

>> Jo, det har da en størrelse: 1024 x 768, og
>> det kan du sagtens forholde dig til i din css.
>
> Rent teknisk optræder det i browseren som
> om det slet ikke er der ud over at det pynter.

Det jeg mente med det er at du blot kan lave et
link på selve billedet - tilbage til forsiden.

Det har også den fordel at brugeren kan se det
hele, også i mindre vinduer end 1024 x 768.

Som det er nu, er det kun tredjedel af billedet
der er et link i IE8 - og næsten det hele i FF3.

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

---

Allan Vebel skrev:

> Det jeg mente med det er at du blot kan lave et
> link på selve billedet - tilbage til forsiden.

Det er umuligt. Billedet er baggrund.

(Ja, det er en lidt usædvanlig konstruktion)

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

---

Bertel Lund Hansen skrev:

> Det er umuligt. Billedet er baggrund.

Intet er umuligt - du kan da bare gøre det
til et normalt billede i

http://obese.dk/baggrundsbilledet.htm

.... og lave dit link.

Billedet ligger jo i forvejen i cashen, så det
skal ikke engang hentes hjem igen.

Det har også den fordel at det nu også kan
udskrives.

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

---

"Birger Sørensen" <sdc@bbsorensen.com> wrote in message
news:4b0c0913$0$283$14726298@news.sunsite.dk...
> De 100% padding giver så også sikkerhed for nogle uanvendelige
> scrollbarer i alle tilgængelige retninger, skulle man have lyst/brug
> for det..
> Jeg vil nu stadig mene, at display : block; er nok til at man kan style
> sit link som der er brug for...

Jeg kan ikke få det til at virke med display : block; og lign. - der er tale
om en 'tom' celle, hvor linket på en måde er baggrundsbilledet.

De 100% padding giver et lidt for stort link (i FF), hvilket er logisk nok,
da det giver 200%

En padding på 50% virker i bredden, men underligt nok ikke i højden, men
th a, td a {padding: 0 50% }
virker fint her, og giver det ønskede resultat.


--
Med venlig hilsen/Best regards
Stig Johansen

---

Stig Johansen wrote:

> En padding på 50% virker i bredden, men underligt nok ikke i højden, men
> th a, td a {padding: 0 50% }
> virker fint her, og giver det ønskede resultat.

Men så var der lige det der med, at IE(6) ikke viser tomme celler, så der
måtte lige en &nbsp; ind, hvilket medfører at <a>'en blev lidt for stor.

så 45% passer bedre i den størrelse.

--
Med venlig hilsen
Stig Johansen

---

Stig Johansen skrev:
> Stig Johansen wrote:
>
>> En padding på 50% virker i bredden, men underligt nok ikke i højden, men
>> th a, td a {padding: 0 50% }
>> virker fint her, og giver det ønskede resultat.
>
> Men så var der lige det der med, at IE(6) ikke viser tomme celler, så der
> måtte lige en &nbsp; ind, hvilket medfører at <a>'en blev lidt for stor.
>
> så 45% passer bedre i den størrelse.

Så vidt jeg husker, kan man fuske ganske bravt med font-size: 0; også i IE6.

Hvis du alligevel skal have et eller andet tegn ind, kan du ligeså godt
putte et bogstav eller sigende tegn i stedet for &nbsp; som ikke siger
det store (og fylder 6 tegn hvis det har noget at sige), og så
font-size: 0; som ikke kan ses alligevel.

Men med dette, vil man have noget at klikke på uden CSS (jeg kan ikke
huske, om der yderligere skal padding eller line-height eller lign, men
skal nok finde det), og bogstavet vil (måske?) give et hint - hvis det
ellers kan være en hjælp. Hvis man er konsekvent kan man måske bruge
f.eks. L=link, E=erase osv. - uden jeg ved, hvilke funktioner, du vil
have sådan nærmere.

Det minder lidt om smiley-projektet, hvis du kan huske det.
Tekstsmiley"tegnene" var sat som font size 0, og indsat grafiksmileyen
som baggrundsbillede i stedet. Fordi dette var sat i CSS, blev
tekstsmileyen vist hvis CSS blev slået fra (så var tekstsmileyen normal
font størrelse). Det var det, du lavede toggle-script til engang.


Hvis du vil, skal jeg kode et eksempel. Det bør virke, for jeg har brugt
det flere andre steder.

Hvis du er i tvivl om, hvad jeg mener, så se din tabel uden CSS, der er
kun understregningen, hvor man kan klikke.

Hmm.. hvis jeg ikke har forstået det rigtigt, må du jo sige til ;)


MVH
Rune Jensen

---

Rune Jensen skrev:

> Hvis du alligevel skal have et eller andet tegn ind, kan du ligeså godt
> putte et bogstav eller sigende tegn i stedet for &nbsp; som ikke siger
> det store (og fylder 6 tegn hvis det har noget at sige)

Hvis det har, bruger man det hårde mellemrum uden at kode det.

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

---

Bertel Lund Hansen wrote:

> Rune Jensen skrev:
>
>> Hvis du alligevel skal have et eller andet tegn ind, kan du ligeså godt
>> putte et bogstav eller sigende tegn i stedet for &nbsp; som ikke siger
>> det store (og fylder 6 tegn hvis det har noget at sige)
>
> Hvis det har, bruger man det hårde mellemrum uden at kode det.

Nej, det var mere det med, at evt. tegn ikke skulle vises ovenpå billedet.
Jeg skriver i stedet et par bogstaver, og sætter color:transparent, så
passer det i stedet for padding, og teksten forstyrrer ikke
billedet/ikonet.

--
Med venlig hilsen
Stig Johansen

---

Bertel Lund Hansen skrev:
> Rune Jensen skrev:
>
>> Hvis du alligevel skal have et eller andet tegn ind, kan du ligeså godt
>> putte et bogstav eller sigende tegn i stedet for &nbsp; som ikke siger
>> det store (og fylder 6 tegn hvis det har noget at sige)
>
> Hvis det har, bruger man det hårde mellemrum uden at kode det.

Det er SHIFT+Space eller...?


MVH
Rune Jensen

---

Rune Jensen skrev:

> > Hvis det har, bruger man det hårde mellemrum uden at kode det.

> Det er SHIFT+Space eller...?

Nej, på et Windowssystem er det Alt + 0 1 6 0 (på num. tastatur).

Jeg ville ønske det lå på Ctrl-Space. Det er meget logisk.

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

---

Rune Jensen wrote:

> Hvis du alligevel skal have et eller andet tegn ind, kan du ligeså godt
> putte et bogstav eller sigende tegn i stedet for &nbsp; som ikke siger
> det store (og fylder 6 tegn hvis det har noget at sige), og så
> font-size: 0; som ikke kan ses alligevel.

Det er en meget god ide, bortset fra det ikke virker.
Når font size er 0, bliver a tagget også 0, men jeg fandt en anden metode.

> Men med dette, vil man have noget at klikke på uden CSS (jeg kan ikke
> huske, om der yderligere skal padding eller line-height eller lign, men
> skal nok finde det), og bogstavet vil (måske?) give et hint - hvis det
> ellers kan være en hjælp. Hvis man er konsekvent kan man måske bruge
> f.eks. L=link, E=erase osv. - uden jeg ved, hvilke funktioner, du vil
> have sådan nærmere.

Problemet var ikke så meget om der står et bogstav, men at den ikke måtte
ligge over billedet.

Så løsningen blev, at jeg skriver Sh(ow),Ed(it),De(lete) - de passer
nogenlunde med de 16 px billedet er, og så sætter dem til transparent.

Det har den ydeligere fordel, at da IE hverken udenrstøtter th+td.. og
transparent, så virker (vises) der også noget dér.

> Det minder lidt om smiley-projektet, hvis du kan huske det.
> Tekstsmiley"tegnene" var sat som font size 0, og indsat grafiksmileyen
> som baggrundsbillede i stedet. Fordi dette var sat i CSS, blev
> tekstsmileyen vist hvis CSS blev slået fra (så var tekstsmileyen normal
> font størrelse). Det var det, du lavede toggle-script til engang.

Jo, det kan jeg godt huske, men det var ikke brug for at lave links.

> Hmm.. hvis jeg ikke har forstået det rigtigt, må du jo sige til ;)

Det er rigtigt forstået, men problemet var det sk*de a tag.

I virkeligheden havde jeg en plan om at lave det rent via javascript, så er
der ikke brug for alle disse <a href.. i hver enkelt celle.

Men hvis jeg gør det, så kan konceptet ikke bruges i relation til
søgemaskiner, da de ikke vil finde noget indhold.

Så jeg gør det, at jeg bruger <a href.. til Show, og javascript til edit og
delete.

Så jeg sparer alligevel 2/3 af de lange hrefs.

--
Med venlig hilsen
Stig Johansen

---

Stig Johansen skrev:
> Rune Jensen wrote:
>
>> Hvis du alligevel skal have et eller andet tegn ind, kan du ligeså godt
>> putte et bogstav eller sigende tegn i stedet for &nbsp; som ikke siger
>> det store (og fylder 6 tegn hvis det har noget at sige), og så
>> font-size: 0; som ikke kan ses alligevel.
>
> Det er en meget god ide, bortset fra det ikke virker.
> Når font size er 0, bliver a tagget også 0, men jeg fandt en anden metode.

Jeg må lige tage en ekstra kig på koden så. Der var en del probledmer
med det, det kan jeg godt huske, men jeg lavede en masse undersider til
projektet, mindst én af dem virker det på. Hvorfor det ikke virker på
hovedsiden beats me.. Mener ikke, jeg har rettet i CSSen der.

Vi satte en <span> udenom, det må vel svare til <a>, for de er begge inline.

Jeg kigger lige på det. Du behøver ikke bruge evt. alternativ løsning,
men jeg er selv lidt interesseret i problemet.

<SNIP>
> Problemet var ikke så meget om der står et bogstav, men at den ikke måtte
> ligge over billedet.

Ja, det var som i smileyprojektet ;)

> Så løsningen blev, at jeg skriver Sh(ow),Ed(it),De(lete) - de passer
> nogenlunde med de 16 px billedet er, og så sætter dem til transparent.
>
> Det har den ydeligere fordel, at da IE hverken udenrstøtter th+td.. og
> transparent, så virker (vises) der også noget dér.

Smart tænkt. Jeg må føje transparent til min "fuskerliste"... Den havde
jeg godt nok ikke lige tænkt på ;)

<SNIP: smiley>
> Jo, det kan jeg godt huske, men det var ikke brug for at lave links.

Nej, jeg tænkte som sagt, at span svarede til a-tagget, da begge er inline.

<SNIP>
> I virkeligheden havde jeg en plan om at lave det rent via javascript, så er
> der ikke brug for alle disse <a href.. i hver enkelt celle.
>
> Men hvis jeg gør det, så kan konceptet ikke bruges i relation til
> søgemaskiner, da de ikke vil finde noget indhold.

Havde det ikke været for IE6, kunne man måske fuske med :after og/eller
:content - det er CSS3. Der er så vidt jeg husker netop en speciel
CSS3-funktion alene til at løse det problem også, for folk har altid
haft problemet. F.eks. at man vil have et billede som overskrift
(H-tag), men kun, når CSS er slået til. Underforstået det skal virke
uden at bruge <img> også. Fra IE9 burde det i hvert fald være muligt at
bruge en sådan CSS3-løsning (men OK - ude i fremtiden).

> Så jeg gør det, at jeg bruger <a href.. til Show, og javascript til edit og
> delete.
>
> Så jeg sparer alligevel 2/3 af de lange hrefs.

Ja, jeg tænkte nok, det var noget med optimering at gøre.

Det virker fint, det du har lavet, så jeg laver bare nogle flere forsøg
"in the background". Jeg er som sagt lidt interesseret i problemet selv,
da jeg har behov for (kreative) løsninger som disse jævnligt.


MVH
Rune Jensen

---

Rune Jensen wrote:

> Jeg må lige tage en ekstra kig på koden så. Der var en del probledmer
> med det, det kan jeg godt huske, men jeg lavede en masse undersider til
> projektet, mindst én af dem virker det på. Hvorfor det ikke virker på
> hovedsiden beats me.. Mener ikke, jeg har rettet i CSSen der.

Jeg har ikke kigget på smiley projegtet, så jeg ved ikke om det virker.

> Vi satte en <span> udenom, det må vel svare til <a>, for de er begge
> inline.
>
> Jeg kigger lige på det. Du behøver ikke bruge evt. alternativ løsning,
> men jeg er selv lidt interesseret i problemet.

Uanset hvad, så kunne jeg kun få a tagget til at virke vha padding, hvis
indholdet er blankt.

>> Det har den ydeligere fordel, at da IE hverken udenrstøtter th+td.. og
>> transparent, så virker (vises) der også noget dér.
>
> Smart tænkt. Jeg må føje transparent til min "fuskerliste"... Den havde
> jeg godt nok ikke lige tænkt på ;)

Jeg var også for hurtig, for IE 8 understøtter åbenbart heller ikke
transparent, så der vises teksten oven i billedet.

Indtil videre er det en fordel at have teksen, for IE6 kan ikke vise
baggrundsbilledet, så der vil det ellers være tomt.

Indtil videre har jeg sat font-weight til 100, så er det knapt så slemt.

>
>> Så jeg gør det, at jeg bruger <a href.. til Show, og javascript til edit
>> og delete.
>>
>> Så jeg sparer alligevel 2/3 af de lange hrefs.
>
> Ja, jeg tænkte nok, det var noget med optimering at gøre.

Ja :) - det betyder faktisk ret meget hvis der f.eks. er flere hundrede
rækker.
Ved at bruge td+th 'tricket', så slipper jeg for at have en class="edit"
eller lign. på hver celle.
Og ved at have en blank <a href.., slipper jeg for at bruge <ing src=...> i
hver eneste celle.

Og ved at lave det med JS, så slipper jeg for <a href.. i hhv ret og slet
celle, så en typisk række ser sådan her ud:
....
<tr id='i4'><td>Installation</td><td>Byg tabel Databaseviews</td><th><a
href='show.notes.asp?databasename=Notes&amp;id=4'
target='_blank'>Sh</a></th><td>Ed</td><td>De</td>
.....
Hvis jeg lavede show med javascript, så kunne jeg nøjes med:
.....
<tr id='i4'><td>Installation</td><td>Byg tabel
Databaseviews</td><th>Sh</th><td>Ed</td><td>De</td>
....

Så du kan godt se hvis jeg havde <a href.. på alle 3, så bliver det til
nogle KB, samt en masse unødige nodes i DOM træet.

Kommer lige i tanke om et hint.
Selvom whitespace normalt er ligegyldigt i HTML, og man foretrækker en
læsbar kildekode, så danner whitespace en ekstra text node.

Af hensyn til test skriver jeg en crlf ved hver <tr>, men det betyder at jag
har lige så mange (overflødige) text nodes, som jeg har <tr> nodes.
Osv..

Det kan du skrive ind i dit notesystem under html/performance/whitespace ;)

> Det virker fint, det du har lavet, så jeg laver bare nogle flere forsøg
> "in the background". Jeg er som sagt lidt interesseret i problemet selv,
> da jeg har behov for (kreative) løsninger som disse jævnligt.

Hvis du finder en ide til hvordan det kan lade sig gøre, så vil jeg gerne
høre om det.

Lige nu er jeg blank, for den med paddingen er ikke så god, da der gerne
skal være normal tekst aht. IE6.

--
Med venlig hilsen
Stig Johansen

---

Stig Johansen skrev:
> Rune Jensen wrote:

>>> Det har den ydeligere fordel, at da IE hverken udenrstøtter th+td.. og
>>> transparent, så virker (vises) der også noget dér.
>> Smart tænkt. Jeg må føje transparent til min "fuskerliste"... Den havde
>> jeg godt nok ikke lige tænkt på ;)
>
> Jeg var også for hurtig, for IE 8 understøtter åbenbart heller ikke
> transparent, så der vises teksten oven i billedet.
>
> Indtil videre er det en fordel at have teksen, for IE6 kan ikke vise
> baggrundsbilledet, så der vil det ellers være tomt.
>
> Indtil videre har jeg sat font-weight til 100, så er det knapt så slemt.

Transparency 1.0? Men det understøtter IE8 så vel heller ikke..

Jeg tænkte faktisk på, om man kan bruge

a{
   content: "";
   background-image: url(image.gif);
}

Så vidt jeg ved, understøtter IE8 netop content (i denne forbindelse).
Men jeg har ikke tid til at teste, så jeg skal have fat i kodehatten,
når jeg kommer hjem.

Ovenstående krøver også man kan tilgå hver <a>, f.eks. a la td+td+a -
hvis der er flere forskellige link-tekster, er jeg i tvivl mht. IE7+8. I
andre, der kan man style udfra indholdet a <a>, sådan at
baggrundsbilledet sættes efter linkteksten (CSS3), så der burde det være
ret nemt.

Hvis det kan lade sig gøre, sørger man for altid at sætte i samme
rækkefølge, sådan at f.eks. første kolonne er show, næste delete osv.
(har du nok tænkt på).


MVH
Rune Jensen

---

Rune Jensen wrote:

>>
>> Indtil videre har jeg sat font-weight til 100, så er det knapt så slemt.
>
> Transparency 1.0? Men det understøtter IE8 så vel heller ikke..

Aner det ikke, men nu har jeg fundet noget der virker i IE8, (men ikke i
FF).
I IE8 virker det hvis jeg sætter font-size: 1px, ikke 0 - og padding:50%;
Godt nok kommer der sikkert et par pixels, men dem kan jeg ikke se.

I FF bliver den dog dobbelt så stor med padding:50%, hvor fanden den end får
det fra, men der kan jeg bruge color:transparent.

Så løsningen må blive noget CC, hvor der skelnes mellem
color:transparent
og
font-size:1px samt padding: 50%

Kan man lave CC inde i selve <style> delen, eller skal det uden om ?

> Hvis det kan lade sig gøre, sørger man for altid at sætte i samme
> rækkefølge, sådan at f.eks. første kolonne er show, næste delete osv.
> (har du nok tænkt på).

Jo, det har jeg, og det skulle også løses, både i CSS og i JS.
Udfordringen var, at det jo er dynamisk, så man kan definere forskellige
felter i forskellige views, så det jeg ved, er at de 3 _sidste_ kolonner er
Show,Edit,Delete

Jeg lavede lige et ekstra view - installation.
<http://w-o-p-r.dk/notes/show.base.asp?databasename=Notes>
Her kan du se forskellen mellem f.eks. bruttoliste og installation.
På viewet installation er der sat filter på, så kun notes under installation
vises.

På CSS siden har jeg gjort det, at jeg genererer de dynamiske felter med td
td osv, Og de 3 sidste laver jeg som th td td
På den måde ved jeg, at Show er td+th, edit er th+td og delete er th+td+td.
(Det er sådan jeg sætter baggrundsbillederne).

I javascriptet tjekker jeg på antal kolonner - kolonnenummeret, så der ved
jeg at 0 = delete, og 1 = edit.

--
Med venlig hilsen
Stig Johansen

---

Stig Johansen wrote:

> Kommer lige i tanke om et hint.
> Selvom whitespace normalt er ligegyldigt i HTML, og man foretrækker en
> læsbar kildekode, så danner whitespace en ekstra text node.

Og - pis, jeg faldt lige i fælden da jeg rettede noget - godt nok var det
JS, men jeg kom til at 'generere' en ekstra text node, så tælleren med
sidste node ctr næstsidste blev forskudt.

Så 'edit' virkede ikke, og 'delete' blev til edit.

> Af hensyn til test skriver jeg en crlf ved hver <tr>

Og så skal jeg lige huske _ikke_ at lave whitesoace mellem td'erne ;)

--
Med venlig hilsen
Stig Johansen