Heippa! Haluaisin tehdä menun, jossa linkit ovat tuollaisia laatikoita, jotka vaihtavat väria kun kursorin vie kohdalle. En osaa muuttaa koodia niin, että se toimisi muillakin selaimilla kun IE:llä. Muilla selaimilla laatikot menevät päällekkain jos laittaa paddingia, eivatka ne tottele leveyden ja korkeuden määrityksiä. Osaisiko joku auttaa?
HTML >>>>>>
loota
laatikko
CSS >>>>>>>
a.box {
width: 100px;
height: 50px;
padding-left: 25px;
padding-top: 15px;
background-color: pink;
text-decoration: none;
border-bottom: solid black 1px;
}
a:hover.box {
background-color: yellow;
}
Välkkyvä linkkilaatikko
moona
7
578
Vastaukset
- Ruussi
Tee linkkilista näiden ohjeiden mukaan:
http://css.maxdesign.com.au/listamatic/ - Poro1
kokeilepas tuollaista:
-----
a.navi2
{
text-decoration: none;
display: block;
padding: 2px;
width: 99%;
border-bottom: 1px solid #c0c0c0;
line-height: 25px;
}
a:link.navi2 {color: #ffffff;}
a:visited.navi2 {color: #ffffff;}
a:hover.navi2 {background-color: #000000;color: white;border-right: 3px solid yellow;}
-------
Linkki
Tämä siis ilman noita --- viivoja ja mahdollisia suomi24:n lisäämiä puolipisteitä ; ja tietysti tarkoittaa esim. pystytasoon linkin allekkain. Voit kokeilla myös vaakaan peräkkäin, mutta vaatii muutoksia...
:) - moona
Joo, kiitos. Vastaus ongelmaan on siis
"display: block;" :)- Poro1
Se display block on lähinnä tulostusta varten, ettei kaikki hienoudet tulostettaessa tule mukaan....
(kaiketi...?)
:)
Jos enkku sujuu: http://www.w3schools.com ja sieltä vasemmalta "learn css" ja avautuvalta sivulta "try it yourself" jossa on lista kaikesta kivasta ja näet miten se on tehty ja voit muuttaa koodia ja testata mitä tapahtuu...
Samoin jos haluat lisää opiskella: "learn html" ja "try it yourself". - Höpö
Poro1 kirjoitti:
Se display block on lähinnä tulostusta varten, ettei kaikki hienoudet tulostettaessa tule mukaan....
(kaiketi...?)
:)
Jos enkku sujuu: http://www.w3schools.com ja sieltä vasemmalta "learn css" ja avautuvalta sivulta "try it yourself" jossa on lista kaikesta kivasta ja näet miten se on tehty ja voit muuttaa koodia ja testata mitä tapahtuu...
Samoin jos haluat lisää opiskella: "learn html" ja "try it yourself".»Se display block on lähinnä tulostusta varten, ettei kaikki hienoudet tulostettaessa tule mukaan.... »
Kyllä sitä siihenkin VOI käyttää ( display:no; ), mutta jos display on VAIN tulostusta varten, niin miksi siinä on muitakin vaihtoehtoja joista tärkeimmät ovat block, inline ja list-item.
block: rivinvaihto ennen ja jälkeen elementin (käytännöstä tekee elementistä ikään kuin lohkoelementin)
inline: ei rivinvaihtoa ennen eikä jälkeen elementin (käytännössä tekee elementistä ikään kuin in-line elementin)
list-item: sama kuin block, paitsi että lisätään listamerkki
none: elementtiä ei näytetä - Höpö
Höpö kirjoitti:
»Se display block on lähinnä tulostusta varten, ettei kaikki hienoudet tulostettaessa tule mukaan.... »
Kyllä sitä siihenkin VOI käyttää ( display:no; ), mutta jos display on VAIN tulostusta varten, niin miksi siinä on muitakin vaihtoehtoja joista tärkeimmät ovat block, inline ja list-item.
block: rivinvaihto ennen ja jälkeen elementin (käytännöstä tekee elementistä ikään kuin lohkoelementin)
inline: ei rivinvaihtoa ennen eikä jälkeen elementin (käytännössä tekee elementistä ikään kuin in-line elementin)
list-item: sama kuin block, paitsi että lisätään listamerkki
none: elementtiä ei näytetäEi tämä nyt välttämättä tähän kuulu, mutta huomasin just äsken mitä tapahtuu kun TopStylessä painaa F1 -nappia kun on jokin css-ominaisuus valittuna. No se tietenkin näyttää mitä mikäkin arvo tarkoittaa. Joka päivä oppii jotain uutta:)
- Höpö
Höpö kirjoitti:
Ei tämä nyt välttämättä tähän kuulu, mutta huomasin just äsken mitä tapahtuu kun TopStylessä painaa F1 -nappia kun on jokin css-ominaisuus valittuna. No se tietenkin näyttää mitä mikäkin arvo tarkoittaa. Joka päivä oppii jotain uutta:)
TopStylessä ei ole kerrottu läheskään kaikkea. Enemmän displaysta löytää (tietenkin) seuraavasta linkistä:
http://www.w3.org/TR/REC-CSS2/visuren.html#display-prop
Ketjusta on poistettu 0 sääntöjenvastaista viestiä.
Luetuimmat keskustelut
SDP jo 100 % suositumpi kuin persut
Kertoo Hesarin uusin kannatuskysely. Demareiden kannatus on miltei tuplat verrattuna persuihinl. Suomen kansa ei selväst7010528- 2404494
SDP haluaa 40 000 nettomaahanmuuttajaa
SDP:n Suunnanmuutos-vaihtoehtobudjetissa, käy ilmi, että demarit itse asiassa vaativat räjähdysmäistä ”työperäisen” maah1553892Orpo: Velkajarrua vastustavaa puoluetta vaikea ajatella hallitukseen
No Minja Koskelan kommunistipuolue jäi ulos tuosta. Kaikki eduskuntapuolueet vasemmistoliittoa lukuun ottamatta sopivat1613388PS ylivoimainen nousija myös HS:n gallupissa, SDP laskee taas
https://www.verkkouutiset.fi/a/hs-gallup-sdpn-suosio-laskee-ps-nousussa/#0a7d2507 Ylivoimainen viime kuukausien nousija403138Valtavasti suomalaisia asunnottomina, mutta ei yhtään somalia
tai muuta kehitysmaalaista. Mites tässä näin kävi? Tiedän hyvin, että esim. somaleita lentää ulos mm. Hekan asunnoista,432847Mikä tämä henkilö mahtaa touhuta Parkanossa
Kamalaa https://www.ylasatakunta.fi/teksti/pirkanmaan-karajaoikeus-vangitsi-koiran-tappamisesta-epaillyn-6.68.127794.b58322320Ikävä sinua mies
Vuosia kuluu, mutta tunteet ei ole hävinnyt. Tasoittuneet toki, kun ei olla nähty. Järki palannut päähän kuitenkin. Se i201930Hienoa! Eduskunta luopui käteisen käytöstä
Nyt tuo sama muutos pitää saada myös muuhun yhteiskuntaan. Käteistähän ei tarvitse tänä päivänä enää kuin rikolliset.621726Sulla on avaimet ja keinot
Jos haluat jatkaa tutustumista. Itse olen niin jäässä etten pysty tekemään enää mitään. Pidempi keppi johon on helpompi251445