a href nie rozciąga hiperłącza przy display block i float left

Question

<div class="bottom">
						
						<a href="#" class="n1">1</a>
						<a href="#" class="n2">2</a>
						<a href="#" class="n3">3</a>
						<a href="#" class="n4">4</a>
						<a href="#" class="n5">5</a>
						<a href="#" class="n6">6</a>
						<a href="#" class="n7">7</a>
						<a href="#" class="n8">8</a>
						<a href="#" class="n9">9</a>
						<a href="#" class="n10">10</a>
						<a href="#" class="n11">11</a>

						<div style="clear: both;"></div>

					</div>

css:

.bottom
{
	width: 660px;
	height: 70px;

	margin-left: 10px;
	margin-top: 10px;

	background-color: #202020;
}

a.n1, a.n2, a.n3, a.n4, a.n5, a.n6, a.n7, a.n8, a.n9, a.n10, a.n11
{
	width: 60px;
	height: 50px;

	display: block;

	float: left;
}

a.n1 {background-color: #080;}
a.n2 {background-color: #600;}
a.n3 {background-color: #080;}
a.n4 {background-color: #600;}
a.n5 {background-color: #080;}
a.n6 {background-color: #600;}
a.n7 {background-color: #080;}
a.n8 {background-color: #600;}
a.n9 {background-color: #080;}
a.n10 {background-color: #600;}
a.n11 {background-color: #080;}

hiperłącze zanika w połowie 8 hiperłącza, próbowałem to inaczej zrobić i nie wyszło, ma ktoś jakiś pomysł?

Answer 1

Nie łatwiej zamiast height i width przy linkach po prostu dać paddingi?

Comments

a hiperłącze będzie na całym kafelku?

---

Jeżeli zastosujesz to do selektora linku, czyli w CSS odniesiesz się do linku to tak:

a {
padding: 20px;
}

np tak, zależy jak tam wolisz to już sobie ustaw.

Answer 2

Tak patrzę i nie rozumiem co chcesz osiągnąć. Przecież jest miejsce tylko na jeden odsyłacz (na jeden rząd odsyłaczy). Każde <a> ma 50px, a rodzic tylko 70px wysokości.

Comments

to ma być menu, ale w połowie 8 kafelka znika hiperłącze