Hva er feil med denne linken?

[Mr Vest]

<a title="Klikk på dette bildet" href=""><img src="url-til-bilde" class="bildeklasse"></a>

Alt jeg vet, det er at dette er galt. Linken fungerer og alt er bra, men det er allikevel noe som ikke er riktig med måten det er satt opp. Hva er det som er galt?

Hvordan lager man en link på et bilde, og får alt helt etter boka?

 

[picxx]

<a href="" title="beskrivelse av bildet"><img src="url-til-bilde" alt="mitt flotte bilde" class="bildeklasse"></a>

Vet ikke hvordan det er med class inne i img src, men normalt bruker man vel bare en div for å definere class eller?

 

[Mr Vest]

Nja, jeg tror ikke det har noe med den og gjøre. Den bare har jeg der fordi jeg da i cssfila kan style bildet slik det passer meg. Jeg bruker

img.bildeklasse {
border:1px solid #AAAAAA;
padding:1px;
width:498px;
height:198px;
}

f.eks i CSS for å style bare bildet. Noen ville nok lagt alt sammen i en div og brukt

#divnavn img {
border:1px solid #AAAAAA;
padding:1px;
width:498px;
height:198px;
}

istedenfor i cssfila. Det er liksom bare to forkjellige løsninger akkurat det, for å oppnå samme greie.

Altså, koden jeg har i innlegget mitt over funker som den skal, men jeg legger merke til (i firebug for firefox) at dersom jeg markerer linken, at den ikke dekker hele bildet på skjermen, men bare en liten del nederst på bildet. (samme høyde som teksten ville vært dersom det var tekst istedenfor et bilde.)

Legger også merke til at i IE, så kommer det faktisk et mellomrom under bildet dersom jeg lager linken på denne måten, man kan altså klikke et par-tre-fire piksler under bildet i IE...

 

[Mr Vest]

Hehe, det ser ut til at det er Firebug som har hatt det gøy med meg her, og forandret litt på den faktiske koden.

Det viste seg at det i kildekoden var:

<a class="" title="" href=""><div class=""><img class="" src=""></a></div>

Ble fort litt mer som det skulle når jeg fikk <div class=""> før linken starter.

 

[Pong]

Forresten...
img objektet må ha en alt property for å validere (ok, ikke under alle dtd'er)..

 

[Bjørnar]

for å følge opp det Pong skriver her, så må tagger som ikke krever avslutningstag (for eksempel <p> avsluttes med </p>), avsluttes med /, pga validering.

eksempel slik jeg ville gjorrt det:

<a href="#" alt="Beskrivende tekst" title="Bildetittel">
  <img src="url-til-bilde" class="bildeklasse" />
</a>