Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: span z background-image na 100%
Forum PHP.pl > Forum > Po stronie przeglądarki > CSS
_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;
}


  1. <div class="nr">
  2. <span>1</span>
  3. </div>


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 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 sad.gif jakas rada?
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:

  1. <p>idz do strony: <span>1</span><span>2</span><span>3</span></p>
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;
}

  1. <div><p>idz do strony:</p><span>1</span><span>2</span><span>3</span></div>
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.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.