Hei,
kertoisiko joku paremmin css:ää tunteva, kuinka
on mahdollista saada 3 kuvaa rinnakkain elementtiin niin että koko elementin alue olisi käytössä.
Mitä muutoksia alla mainittuun koodiin on hyvä tehdä, jotta kaikki näkyisi "oikein" suurimmalla osalla selaimista...pikseleistä näkyy olevan haittaa myös, mutta operalla tämä alla mainittu koodi näkyy oikein eli tavoite olisi saada koodi sellaiseksi, että myös muut selaimet osaisivat tulkita sen.
Avustanne kiittäen,
Sivun yläosa
body
{
background-color:gray;
margin-top: 0px;
margin-bottom: 0px;
margin-left: 0px;
margin-right: 0px;
padding-left: 0px;
padding-right: 0px;
}
#Otsake
{
margin-bottom: 0px;
margin-left: 0px;
margin-right:0px;
padding: 0px;
height: 140px;
background-color:gold;
}
.Kuva1
{
float: left;
}
.Kuva2
{
float:left;
}
.Kuva3
{
float:right;
}
kertoisiko joku paremmin css:ää tunteva, kuinka
on mahdollista saada 3 kuvaa rinnakkain elementtiin niin että koko elementin alue olisi käytössä.
Mitä muutoksia alla mainittuun koodiin on hyvä tehdä, jotta kaikki näkyisi "oikein" suurimmalla osalla selaimista...pikseleistä näkyy olevan haittaa myös, mutta operalla tämä alla mainittu koodi näkyy oikein eli tavoite olisi saada koodi sellaiseksi, että myös muut selaimet osaisivat tulkita sen.
Avustanne kiittäen,
Sivun yläosa
body
{
background-color:gray;
margin-top: 0px;
margin-bottom: 0px;
margin-left: 0px;
margin-right: 0px;
padding-left: 0px;
padding-right: 0px;
}
#Otsake
{
margin-bottom: 0px;
margin-left: 0px;
margin-right:0px;
padding: 0px;
height: 140px;
background-color:gold;
}
.Kuva1
{
float: left;
}
.Kuva2
{
float:left;
}
.Kuva3
{
float:right;
}
Vastaukset 1
Vanhimmat
En nyt oikein tiedä millaiselta haluat tuon näyttävän, sillä ainakin minun Operani (8.5 ja 9beta) näyttivät koodisi samoin kuin IE.
Mutta josko tuosta saisit silti jotain vinkkiä:
body {
background: gray;
margin: 0;
padding: 0;
}
#Otsake {
background: gold;
margin: 0;
padding: 0;
text-align: center;
white-space: nowrap; /* estää rivityksen selainikkunaa kavennettaessa */
}
.Kuva1, .Kuva2, .Kuva3 {
display: inline; /* käsittelee divejä kuten inline -elementtejä (eli käytännössä kuten tekstiä) */
margin: auto;
}