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
451
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
- 213327
Suomalainen perheenisä vaatii Suvivirren esittämisestä hyvityksiä
Itse lapsena uskonnonopetuksesta vissiin traumoja saanut ihka suomalainen (!) perheenisä vaatii Espoon kaupungilta korva5402692Vesikin maksaa, miksei hengitysilma?
Jatkuvasti itketään ettei ole rahaa mihinkään, mutta tilastojen mukaan rahaa on enemmän kuin koskaan, joten miksei asial532260Satuolennoista tarinointi ei kuulu peruskoulun tehtäviin
Opetustunteja on muutenkin käytössä vain rajallinen määrä. Eli nämä satuhommat koulun ulkopuolelle vapaaehtoisiin harras2112234Joensuun kaupunki levittelee tonttitietoja Keskisuomalaiselle
Sähköposteja ja tonttitietoja levitellään mm. Pasi Koivumaalle131709Mies profiloin sinut
Etsit täysin hallittavaa mutta samalla poikkeuksellista ihmistä. Etsit jotain mitä et koskaan tule saamaan.2191519Kiantama kartelli
Onko alhaisempaa kuin toimia ensin kartellissa ja lopuksi koittaa pelastaa nahkasa vasikoimalla muut kun jää kiinni? Eip521471- 971379
Oletko nainen alkanut kammoamaan minua
Sinua ei näy eikä kuulu, ja ilmeisesti kiertelet tilanteita. Oletko huomannut, että olet vieläkin ajatuksissani luvattom621211Saako 60 v vielä töitä? Arto Nyberg puhuu suoraan elämästä ilman töitä
Arto Nyberg täyttää tänään 60 v. Onnea! Nyberg totuttiin näkemään suoran haastatteluohjelman kapteenina vuodesta toise951174