Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [CSS][XML][HTML]Menu Poziome
Forum PHP.pl > Forum > Przedszkole
maciej916
8.08.2011, 13:55:34
Chcę aby na moim menu poziomym było Coś Takiego:


Link (szerokość Link: 100) 1px Przerwy Link (szerokość Link: 100) Link (szerokość Link: 100) 1px


Chodzi mi o to że mój Hover ma 100px a jeśli napis jest krótszy to Hover się ucina Ja bym chciał wydłużyć to aby hover się mieścił w całości


Strona do testów : http://pmf.xaa.pl/radio/


Kod Menu:
Kod
        <div id="menu" class="linki">
            <a href="#">Strona Główna</a>
            <a href="#">O Nas</a>
            <a href="#">Pozdrowienia</a>
            <a href="#">Ramówka</a>
            <a href="#">Ekipa</a>
            <a href="#">Top Lista</a>
            <a href="#">Graj u nas</a>
            <a href="#">Kontakt</a>
            <a href="#" target="_blank">Forum</a>
        </div>


Style:
Kod
#menu {
    background:url(images/menu.png) no-repeat;
    font-size: 11px;
    font-family:Tahoma;
    color:#000000;
    width: 879px;
    height: 45px;
    padding:15px 0px 12px 0px;
}

.linki a{
    font-family:Arial;
    font-size: 12px;
    padding:13px 15px 11px 15px;
    color:#ffffff;
    margin:1px 1px;
}

.linki a:hover{
    background-image: url('images/hover.png');
    background-repeat: no-repeat;
    background-position:center;
    color:#ffffff;
}



Jeśli nie wiecie o co chodzi piszcie
luniak
8.08.2011, 14:05:17 
[PHP] pobierz, plaintext 
  1. .linki a {
  2.  
  3. font-family:Arial;
  4.     font-size: 12px;
  5.     padding:13px 15px 11px 15px;
  6.     color:#ffffff;
  7.     margin:1px 1px;
  8.  
  9.    width: 100px;
  10.    display: block;
  11.    float: left;
  12.    margin-right: 1px;
  13. }
[PHP] pobierz, plaintext


pisane na szybko z ręki ale powinno działać tongue.gif
maciej916
8.08.2011, 14:39:21
Cytat(luniak @ 8.08.2011, 15:05:17 ) *
[PHP] pobierz, plaintext 
  1. .linki a {
  2.  
  3. font-family:Arial;
  4.     font-size: 12px;
  5.     padding:13px 15px 11px 15px;
  6.     color:#ffffff;
  7.     margin:1px 1px;
  8.  
  9.    width: 100px;
  10.    display: block;
  11.    float: left;
  12.    margin-right: 1px;
  13. }
[PHP] pobierz, plaintext


pisane na szybko z ręki ale powinno działać tongue.gif


mam takie style :
Kod
#menu {
    background:url(images/menu.png) no-repeat;
    font-size: 11px;
    font-family:Tahoma;
    color:#000000;
    width: 879px;
    height: 45px;
    padding:3px 0px 12px 0px;
}

.linki a {
    font-family:Arial;
    font-size: 12px;
    padding:13px 15px 11px 15px;
    color:#ffffff;
    margin:1px 1px;
    
    width: 95px;
    display: block;
    float: left;
    margin-right: 1px;
}

.linki a:hover{
    background-image: url('images/hover.png');
    background-repeat: no-repeat;
    background-position:center;
    color:#ffffff;
}


chcę aby hover był wyśrogkowany podukt tekstu
Damonsson
8.08.2011, 16:09:53 
[CSS] pobierz, plaintext 
  1. .linki a {
  2.     color: #FFFFFF;
  3.     display: block;
  4.     float: left;
  5.     font-family: Arial;
  6.     font-size: 12px;
  7.     margin: 1px;
  8.     padding: 13px 15px 11px;
  9.     text-align: center;
  10.     width: 95px;
  11. }
[CSS] pobierz, plaintext

O to chodzi?
maciej916
9.08.2011, 07:13:28
Cytat(Damonsson @ 8.08.2011, 17:09:53 ) *
[CSS] pobierz, plaintext 
  1. .linki a {
  2.     color: #FFFFFF;
  3.     display: block;
  4.     float: left;
  5.     font-family: Arial;
  6.     font-size: 12px;
  7.     margin: 1px;
  8.     padding: 13px 15px 11px;
  9.     text-align: center;
  10.     width: 95px;
  11. }
[CSS] pobierz, plaintext

O to chodzi?



dzięki działa
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.