Ta strona używa ciasteczek (cookies), dzięki którym nasz serwis może działać lepiej. Dowiedz się więcej OK, rozumiem

[HTML/CSS] Problem z hiperłączem

Zaczynasz dopiero swoją przygodę z HTML'em? A może mimo swojego doświadczenia natknąłeś się na jakiś problem? Tutaj na pewno znajdziesz pomoc.

[HTML/CSS] Problem z hiperłączem

Post 13.12.2017, 16:07:25

Siemanko,

Chcąc przypomnieć sobie podstawy html i css postanowiłem stworzyć stronę z poradnikiem, lecz napotkałem
problem- tylko dolna część kafelka jest klikalna (a chciałem by była cała)
(w poradniku jest identycznie tak, jak w kodzie niżej - tam działa, a u mnie nie)
html:
<div class="yt">
<i class="icon-youtube">
<a href="https://www.youtube.com/" class="social" target="_blank"></a>
</i>
</div>

css:
a.social
{

color: #ffffff;
text-decoration: none;
display: block;
width: 105px;
height: 142px;


}


edit: kafelek


.yt
{
margin: 10px;
width: 105px;
height: 142px;
background-color: #d94348;
float: left;

}
baczu
Posty: 3
Dołączył(a): 10.12.2017

Re: [HTML/CSS] Problem z hiperłączem

Post 13.12.2017, 21:03:06

Przecież cała przestrzeń JEST klikalna.Sprawdź co masz wbite w css dla a:link, a:visited, gdzieś musiał ci zostać kawałek poprzedniego stylu.
Avatar użytkownikaLuna_s20
Posty: 98
Dołączył(a): 02.05.2014

Re: [HTML/CSS] Problem z hiperłączem

Post 14.12.2017, 01:21:20

Luna_s20 napisał(a):Przecież cała przestrzeń JEST klikalna.Sprawdź co masz wbite w css dla a:link, a:visited, gdzieś musiał ci zostać kawałek poprzedniego stylu.


Nie widzę żadnego poprzedniego stylu w css. (może ślepy jestem) dlatego postanowiłem dać cały css
body
{
background-color: #303030;
color: #ffffff;
font-family: 'Lato', sans-serif;
font-size: 20px;
}

#container
{

width: 1000px;
margin-left: auto;
margin-right: auto;

}

.rectangle
{

width: 960px;
margin: 20px;

}

.square
{
width: 50%;
float: left;


}
#logo
{

float: left;
font-family: 'Josefin Sans', sans-serif;
font-size: 70px;
width: 600px;
margin-top: 10px;
margin-bottom: 10px;

}

#zegar
{
float: left;
font-family: 'Josefin Sans', sans-serif;
font-size: 70px;
margin-top: 10px;
margin-bottom: 10px;

}
.tile1
{
margin: 10px;
width: 230px;
height: 142px;
background-color: #3095d3;
float: left;
text-align: center;
}
.tile2
{
margin: 10px;
width: 230px;
height: 142px;
background-color: #666666;
float: left;
text-align: center;
}
.tile3
{
margin: 10px;
width: 230px;
height: 142px;
background-color: #93c748;
float: left;
text-align: center;

}
.tile2:hover
{

background-color: #555555

}
.tile3:hover
{
background-color: #82b637
}
.tile4

{
margin: 10px;
width: 420px;
height: 82px;
text-align: center;
font-size: 21px;
padding: 30px;
line-height: 150%;
background-color: #ee5a32


}
.tile4:hover
{

background-color: #dd4a21
}
.tile5
{
margin: 10px;
width: 420px;
height: 244px;
background-color: #666666;
float: left;
text-align: center;
text-align:justify;
padding: 30px;
}
a.tilelink
{


text-decoration: none;
color: #ffffff;
display: block;
width: auto;
height: auto;

}
a.social
{

color: #ffffff;
text-decoration: none;
display: block;
width: 150px;
height: 142px;


}


.tile1:hover
{
background-color: #2084c2
}
.yt
{
margin: 10px;
width: 105px;
height: 142px;
background-color: #d94348;
float: left;

}
.fb
{
margin: 10px;
width: 105px;
height: 142px;
background-color: #4668b3;
float: left;


}
.gplus
{
margin: 10px;
width: 105px;
height: 142px;
background-color: #d95333;
float: left;


}
.tw
{
margin: 10px;
width: 105px;
height: 142px;
background-color: #3095d3;
float: left;


}
baczu
Posty: 3
Dołączył(a): 10.12.2017

Re: [HTML/CSS] Problem z hiperłączem

Post 14.12.2017, 04:36:41

Nadal wszystko gra i buczy. Naprawdę, nie mam pomysłu, po prostu działa jak sobie życzysz. Sprawdziłam na konsolce i nigdzie żaden margin czy inny padding czy pozycja elementu nie wpływa. Więc
1. Usuń pamięć podręczną przeglądaki i sprawdź stronę lokalnie (być może dawno rozwiązałeś problem ale twoja przeglądarka pamięta stary css? Niektóre hostingi również nie pokazują zmian na bieżąco ale dopiero po kilku dniach)
2. Sprawdź czy jakiś element nie "rozpycha" ci tego linku, np któryś title. Bez html'a ciężko określić - być może któryś element swoim paddingiem "odpycha" pozostałe, jeśli nie jest odpowiednio wypozycjonowany.
Avatar użytkownikaLuna_s20
Posty: 98
Dołączył(a): 02.05.2014

Re: [HTML/CSS] Problem z hiperłączem

Post 19.12.2017, 21:49:03

Nadal występuje ów błąd.
Po dokładniejszej analizie kodu nie znalazłem przyczyny, która by to powodowała.
Dla tych, którzy nie wiedzą dokładnie o co mi chodzi: (chce by cały czerwony blok był klikalny)
Obrazek
baczu
Posty: 3
Dołączył(a): 10.12.2017


Powrót do Początkujący webmaster


 


  • Podobne wątki
    Odpowiedzi
    Wyświetlone
    Ostatni post

Kto przegląda forum

Użytkownicy przeglądający ten dział: Google Adsense [Bot] i 10 gości

Hosting, Domeny, SSL

Subskrypcja

Mamy 51036 zarejestrowanych użytkowników.
Najnowszy użytkownik: habibulakorc


Nasi użytkownicy napisali:

  • 936631 wiadomości
  • w 246942 tematach

Najnowsze wpisy na blogu

Najnowsze artykuły

Najaktywniejsi (ostatnie 30 dni)