aloittelijana tällaisen kanssa painiskelen, että css:llä väänsin listan vaakatasoon naviksi. sitten tätä listaa yritin asemoida niin, että osuu solun taustakuvan päälle oikeaan kohtaan (position: relative:n avulla). perusleiska on siis paikoillaan taulukolla, tätä navia yritin asemoida css:llä. Homma pelittää firefoxilla mainiosti, mut ie:llä ei toimi.
ensiksi: asemointi mättää (top-marginia on ie:llä liian vähän). sama juttu jos yrittää absolutella asemoida, ie:ssä listani on aina n. 10px ylempänä. johtuuko tämänyt jostain ie/firefox perustavanlaatuisesta asemointierosta (muistelen hämärästi jotain margin-padding-eroja?)
toinen varsinaiseen listaan liittyvä juttu on, että navin "erotinviiva" ei suostu ie:llä lähtemään pois ekasta linkistä first-child komennolla. mikä voisi auttaa?
tässä ote css:stä:
ul.menu li {
position: relative;
left: 150px;
top: 0px;
display: inline;
list-style-type: none;
border-left: 1px solid #BCB9B2;
margin: 0px;
padding: 0px 15px 0px 15px;
list-style-type: none;
font-family: Arial;
font-size: 10px;
letter-spacing: 1px;
}
ul.menu li:first-child {
border: none;
}
kiitoksia jo etukäteen, jos joku ystävällinen sielu ehtii auttaa...
css lista - ongelmia ie:llä
2
412
Vastaukset
Ongelma piilee siinä, että eri selaimet antavat eri oletusarvoja järjestämättömän listan (UL) marginaaleille ja täytteelle (padding). Siispä jos kokeilet määrätä, että
ul.menu
{
margin: 0;
padding: 0;
}
niin linkkilistan pitäisi näkyä kaikilla selaimilla samassa kohdassa, joskin todennäköisesti väärässä paikassa. Seuraavaksi vain säädät marginin ja paddingin arvot kohdalleen. Lisäksi listan sijaintiin vaikuttavat mahdollisten emoelementtien täytteet ja marginaalit, joten jos haluat saada listan asemoitua varmasti ja tarkasti, lisää CSS-tiedoston alkuun sääntö
*
{
margin: 0;
padding: 0;
}
joka poistaa tyhjän tilan kaikkien elementtien ympäriltä. Nyt voit yksitellen asettaa jokaiselle elementille sopivat arvot.
Internet Explorer, tämä CSS-tekniikan terävintä kärkeä edustava selain, ymmärtää pseudoluokista vain hoverin, ja senkin ainoastaan linkkien yhteydessä (a:hover). Ongelman voi kiertää identifioimalla listan ensimmäisen alkion ja antamalla sille erilaiset tyylisäännöt.
HTML:
Etusivu
Galleria
...
CSS:
#first_link
{
border-left: none;
}
Nyt voit myös poistaa "ul.menu li:first-child" -kohdan.- Höpö
»Internet Explorer, tämä CSS-tekniikan terävintä kärkeä edustava selain..»
Juuri näin :D
Ketjusta on poistettu 0 sääntöjenvastaista viestiä.
Luetuimmat keskustelut
Nyt tajusin mitä haet takaa
En epäile etteikö meillä olisi kivaa missä vaan. Se on iso hyppy henkisellä tasolla sinne syvempään päätyyn, kuten tiedä433753- 382508
Naiselle mieheltä
Huomasin tuossa, että jääkaapissani on eräs sinun ostamasi tuote edelleen avaamattomana. Arvaatko mikä?342031- 231782
- 171699
Ihmetteletkö, mihin sinussa ihastuin?
Pikkuhiljaa huomasin, että olet ainutlaatuinen luonne, plussana tietysti ulkoiset avut. Toista ei taida löytyä koko maai1001612- 231598
Mitä yhteistä on sulla ja kaivatulla?
Onko teillä samantyyppinen olemus tai luonne? Vai muistuttaako vartalonne toisiaan? Tai kasvot? Entä pukeutuminen? Onko991466- 241457
- 221419