dokonywania rozpiętość tag pokrywa całą szerokość div

Question

Mam następującą strukturę HTML: -

<div> 
    <span> 
    <a href="wherever">Wherever</a> 
    </span> 
</div> 

Jeśli chcę rozpiętość pokryć całą szerokość div, w jaki sposób mogę to zrobić w Chrome?

Próbowałem w css za pomocą

span{ 
    background:#FFF; 
    width:100%; 
} 

to działa w Firefox i IE, ale nie w chromie.

Answer 1

span elementy są wbudowane. Elementy śródliniowe automatycznie dostosowują szerokość i ignorują wyrażenia width:.

Zrób to block-level:

span { 
    display: block; 
} 

Ale to w zasadzie tylko <div>. CSS

Answer 2

Zmień rozpiętość do:

span { 
display: block; 
} 

Answer 3

Spróbuj tego:

div{ 
    padding:0px; 
} 
span{ 
    background:#FFF; 
    width:100%; 
} 

Answer 4

Istnieją dwa sposoby, aby rozwiązać problem.

Jako tagi span dostosuj ich szerokość zgodnie z zawartością. Aby przypisać szerokość do tego tagu, użyjemy float left with width.

span{ 
background:#FFF; 
width:100%; 
float: left; 
} 

secod sposobem jest użycie bloku wyświetlacza z kodem

span{ 
background:#FFF; 
width:100%; 
display: block; 
}