Loading:

Postanowienia noworoczne - a Ty czego nauczysz się w nowym roku? [-25%]

Klikalny link na całej szerokości strony - błąd w tagu <A > oraz <SPAN >

Załóżmy, że mamy obrazek jako tło tagu <span> oraz linkujemy go do jakiejś strony.

 

W takim przypadku cała linia na której znajduje się element <span> zostanie naznaczona jako link do tego tagu. Dzieje się tak nawet wtedy kiedy określimy wysokość oraz szerokość dla elementu <span>

 

Dlaczego się tak dzieje?

 

Dzieje się tak ponieważ i <span> oraz <a> tag są elementami liniowymi, co oznacza, że domyślnie wypełniają całą linię obszaru domyślnie.

 

Jak to naprawić?

 

Poprawka jest widoczna na skrypcie pod spodem, eliminuje to linkowany elementy cało liniowy do naszego elementu <span>. (W kodzie podano skrypt CSS do przykładu).

 

Przykład:

 

<a href="www.funkcje.net" class="link">
<span class="elementSpan" style="background-image: url(/obraz.jpg)"> </span>
</a>


Napisz Artykuł

Listing

/* KOD CSS */
.elementSpan {
  width:100px;
  height:100px;
  display:block
}

.link {
  width:100px;
  display:block
}


Ten wpis posiada swój wątek na forum

Wszystkie pytania prosimy kierować właśnie tam ponieważ komentarze to miejsce na poprawki do kodu lub alternatywne rozwiązania i pytania nie będą publikowane

http://forum.funkcje.net/forum/viewtopic.php?f=2&t=5627

Dane do logowania na forum są takie same jak na funkcje.net



Dodano przez: divix
Ranga: Administrator serwisu Punktów: 37719
Komentarze użytkowników
    • Treść komentarza
      Kod do komentarza (opcjonalnie)
      PHP JavaScript MySQL Smarty SQL HTML CSS ActionScript
      Autor
      Token
      token

       

       








funkcje.net
Wszelkie prawa zastrzeżone©. | Funkcje.net 2008-17 v.1.5 | design: diviXdesign & rainbowcolors