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
436
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
Arman Alizadin viesti puna-aktivisteille: "Pitäkää lärvinne nytkin kiinni"
Arman Alizad kritisoi vasemmiston kaksinaismoralismia. Iranissa syntynyt suosikkijuontaja Arman Alizad pakeni perheensä2824150Minja Koskela nostanut vasemmistoliiton kannatuksen ennätykseen
Koskela valittiin puolueen johtoon lokakuussa 2024, ja silloin Ylen kysely antoi puolueelle 9,3 prosentin kannatuksen.1352365Antti johtaa Petteriä jo 7,1 prosenttiyksiköllä
Tällä menolla sdp menee kokoomuksesta kierroksella ohi jo tällä vaalikaudella. https://yle.fi/a/74-20213575822016- 1411511
Hotelli kainuu
Mietityttää, hotelli Kainuussa, se, että asiakkaat voivat valita ketä saa olla ja ketä ei, Illan aikana asiakkaina!39998Seuraavakin hallitus joutuu leikkaamaan
Sitähän tämä hallitus nyt höpöttää, kun itse on ajanut tilanteen katastrofaaliseksi. Orpon hallitus lähti suurin puhein133972- 77959
Ovatko vastasyntyneet vauvat syntisiä?
Se ihmisten keksimä järjetön perisynti, jos ovat!337901Pitäis vaan lopettaa
Sinun kanssa yhteydenpito. Alkaa vaan haluamaan enemmän ja tuskin lopulta mikään kohtaisi. Ja ikävä vaan kasvaa ja lähei8877J. Rinta-Joupilla jättimäinen veropetosvyyhti
Seinäjoen keskustan kiinteismiljonäärit olleet jo pitkään ahtaalla ja liittykö J. Rinta-Jouppikin rintamaan? https://yl62820