Navigaatio

Olen tekemässä sivuilleni linkkejä ja kun hiiren vetää linkin päälle avautuisi alle lisää "ali linkkejä". Kaikki toimii tähän mennessä muuten hyvin mutta Internet exploreria lukkunottamatta linkit, jotka ovat linkitettyjä kuvia menevät päällekkäin. Jos tuossa css tiedostossa laittaa leveydeksi #nav li:ssä width:63px (etusivu.gif:in leveys), niin pidemmät linkkikuvat kuten palvelut saavat liian vähän tilaa. Jos laittaa width:in kokonaan pois niin päälinkit menevät oikeille paikoilleen, mutta alilinkit menevät vierekkäin eivätkä päällekkäin. Olisiko jotain tapaa saada ne näkymään oikein?










Linkkejä
Jotain
Jutskia
Muuta
Hommeleita







Linkkejä
Jotain
Jutskia
Muuta
Hommeleita






Linkkejä
Jotain
Jutskia
Muuta
Hommeleita







ja css tiedosto on tälläinen:



#nav, #nav ul
{
padding: 0;
margin: 0;
list-style: none;
padding-left:0px;
}

#nav li ul
{
display: none;
position: absolute;
top: 23px;
left:0px;
}



#nav li
{
float: left;
position: relative;
width:0px;
text-align:center;
}


#nav li:hover ul, #nav li.over ul
{
display: block;
}


#nav li li a, #nav li li a:hover
{
width:150px;
height:19px;
display:block;
padding-left:4px;
background: none;
background-color:#102A35;
font-family: Verdana;
font-size:7.5pt;
color:#A1C4AE;
font-weight:bold;
text-decoration:none;
padding-top:4px;
border:1px solid #B7BD99;
border-bottom:none;
opacity: .8;
filter: alpha(opacity=80);
text-align:left;
}

#nav li li a:hover
{
color:#ffffff;
}



Linkkien välissä on viivat/tolpat, jotka erottelevat linkin.

Etusivu | Yhteystiedot | Linkki

Jos laittaisin leveyden niin pitkäksi että kaikki linkit mahtuisivat siihen, niin tolppien tila linkkiin nähden olisi jokaisella erimittainen. Eli näkymä ei olisi kauhean mieluisa.


Etusivu |Yhteystiedot| Linkki |

Kun IE osasi juurilinkit ( oletuksena )oikein näyttää, niin ajattelin, että eikö ole tosiaan olemassa mitään koodinpätkää millä se saisi toimimaan.
1383
Äänestä

Muut lukivat myös

Vastaukset 1

Vanhimmat

Ratkaisin ongelma varsin yksinkertaisella tavalla.
Pistin tagiin style="width:150px;"





Linkkejä
Jotain
Jutskia
Muuta
Hommeleita





Eli tuolla tavalla sain ne alilinkit menemään allekkain.

Äänestä

Kommentoi aloitusta


Webe kirjoitti:

Olen tekemässä sivuilleni linkkejä ja kun hiiren vetää linkin päälle avautuisi alle lisää "ali linkkejä". Kaikki toimii tähän mennessä muuten hyvin mutta Internet exploreria lukkunottamatta linkit, jotka ovat linkitettyjä kuvia menevät päällekkäin. Jos tuossa css tiedostossa laittaa leveydeksi #nav li:ssä width:63px (etusivu.gif:in leveys), niin pidemmät linkkikuvat kuten palvelut saavat liian vähän tilaa. Jos laittaa width:in kokonaan pois niin päälinkit menevät oikeille paikoilleen, mutta alilinkit menevät vierekkäin eivätkä päällekkäin. Olisiko jotain tapaa saada ne näkymään oikein?










Linkkejä
Jotain
Jutskia
Muuta
Hommeleita







Linkkejä
Jotain
Jutskia
Muuta
Hommeleita






Linkkejä
Jotain
Jutskia
Muuta
Hommeleita







ja css tiedosto on tälläinen:



#nav, #nav ul
{
padding: 0;
margin: 0;
list-style: none;
padding-left:0px;
}

#nav li ul
{
display: none;
position: absolute;
top: 23px;
left:0px;
}



#nav li
{
float: left;
position: relative;
width:0px;
text-align:center;
}


#nav li:hover ul, #nav li.over ul
{
display: block;
}


#nav li li a, #nav li li a:hover
{
width:150px;
height:19px;
display:block;
padding-left:4px;
background: none;
background-color:#102A35;
font-family: Verdana;
font-size:7.5pt;
color:#A1C4AE;
font-weight:bold;
text-decoration:none;
padding-top:4px;
border:1px solid #B7BD99;
border-bottom:none;
opacity: .8;
filter: alpha(opacity=80);
text-align:left;
}

#nav li li a:hover
{
color:#ffffff;
}



Linkkien välissä on viivat/tolpat, jotka erottelevat linkin.

Etusivu | Yhteystiedot | Linkki

Jos laittaisin leveyden niin pitkäksi että kaikki linkit mahtuisivat siihen, niin tolppien tila linkkiin nähden olisi jokaisella erimittainen. Eli näkymä ei olisi kauhean mieluisa.


Etusivu |Yhteystiedot| Linkki |

Kun IE osasi juurilinkit ( oletuksena )oikein näyttää, niin ajattelin, että eikö ole tosiaan olemassa mitään koodinpätkää millä se saisi toimimaan.

Anonyymi
5000

Ilmoita asiaton sisältö

  • Sisältää materiaalia, joka on loukkaavaa, herjaavaa, rasistista, uhkailevaa tai ahdistelevaa.

  • Materiaali sisältää nimiä, yhteystietoja tai muita henkilökohtaisia tietoja. Julkisuuden henkilöistä, julkisissa viroissa toimivista ihmisistä sekä yritysten vastuuhenkilöistä saa keskustella työhön liittyen. Myös yksityiselämään liittyvistä asioista voi keskustella siltä osin, kuin niistä on julkisesti kerrottu.

  • Sisältää lapsille haitallista tai heiltä kiellettyä materiaalia. Seksuaalinen sisältö on sallittua aiheeseen tarkoitetuilla palstoilla, joiden ikäraja on 18 vuotta.

  • Lainvastaista sisältöä voi olla mm. yksityiselämää loukkaavan tiedon levitys, kiihottaminen kansanryhmää vastaan, laiton uhkaaminen, alaikäisiin liittyvä seksuaalinen sisältö/grooming, petokset, identiteettivarkaudet, kunnianloukkaukset ja tekijänoikeusrikkomukset.

  • Sisältö ei liity palstan tai keskusteluketjun aiheeseen.

  • Viesti ei ole suomea tai ruotsia (pl. International Forums), se sisältää mainontaa, se sisältää tekijänoikeuksin suojattua materiaalia, se on massapostitus tai jokin muu syy.

Jaa keskustelu