span z background-image na 100% Opcje

[_kama]

Problem moze banalny ale nie potrafie sobie poradzic aby span mial szerokosc (i wysokosc) taka jak obrazek ktory jest jego tlem. Obrazek rozciaga sie wraz z wpisywanym tam tekstem ale jezeli tekstu jest za malo, to obrazka pojawia sie tylko czesc. Oto kawalek kodu:

Kod

.nr span {
     background-image: url(img.gif);
     background-repeat: no-repeat;
     height: 12px;
      width: 13px;
      color: #000000;
      font-size: 10px;
}

[HTML] pobierz, plaintext 
<div class="nr">
     <span>1</span>
</div>
[HTML] pobierz, plaintext 

Z gory dzieki za pomoc

[mike]

<span> nie jest elemtem blokowym.
Żeby style height i width działały musisz jeszcze dać display: block;

[_kama]

dzieki (IMG:http://forum.php.pl/style_emoticons/default/smile.gif) o to chodzilo.
a to jest poprawne uzycie? bo nigdy nie korzystalam z tych "display"?

hmmmm.... tyle ze teraz lamie mi sie linia przed tym spanem a tego nie chce (IMG:http://forum.php.pl/style_emoticons/default/sad.gif) jakas rada?

Ten post edytował _kama 5.01.2006, 11:30:31

[mike]

1. Jest to poprawne.
2. Możesz dorzucić jeszcze float (jaki Ci tam pasuje) ale czuję że też coś się posypie. Może da się inaczej zorganizować Twój pomysł? Co chcesz osiągnąć?

[_kama]

Potrzebuje cos takiego:

napis:

"Idz do strony:" - napisane okreslona czcionka itp wiec strowrzylam klase dla p w tym divie

Zaraz po tym napisie musza pojawic sie klocki z numerami stron pisanymi tez innymi czcionkami. Rozwiazanie z display: block rozciagnelo mi odpowiednio tego spana z klockiem, ale zlamalo sie do nastepnej lini. Float: left nie dziala tak jak bym chciala. Ocecnie jest to mniej wiecej tak:

[HTML] pobierz, plaintext 
<p>idz do strony: <span>1</span><span>2</span><span>3</span></p>
[HTML] pobierz, plaintext 

[revyag]

Bez dodatkowego elementu chyba się nie obejdzie:)

Kod

* {
    font-family:Verdana;
}
div {
    font-size:12px;            
}
p {
    float:left;
    margin:0 5px 0 0;
    padding:0;
    font-weight:bold;
}
span {
    font-size:9px;
    margin-right:2px;
    padding:2px;
    background-color:#ffad00;
    width:13px;
    height:12px;
    display:block;
    float:left;
}

[HTML] pobierz, plaintext 
<div><p>idz do strony:</p><span>1</span><span>2</span><span>3</span></div>
[HTML] pobierz, plaintext 

[mike]

Też o czymś takim myślałem, tylko wywaliłbym te <span>'y. Przecież w środku i tak będą jeszcze <a> (tak wnioskuje). Lepiej od razu dać takie style jak teraz ma <span> dla <a>. Po co walić tyle elementów.