Gå til innhold

litt trøbbel med CSS

Smeltelim

Av Smeltelim
i Programmering og webutvikling

Anbefalte innlegg

Smeltelim

Smeltelim

Skrevet
Skrevet

Jeg driver å tester litt med CSS og har støtt på et problem.

jeg skal ha en DIV ned på venstre side av skjermen, denne skal være 20px bred.

på denne skal det være noen linker (DIV's), disse skal ligge litt inne i den linjen og stikke litt utenfor som vist på bildet under.

 

ff.jpg dette bildet er tatt i FireFox.

 

Når jeg åpner siden i IE så blir det en helt annen sak.

 

ie.jpg

 

hvordan kan jeg få det til å bli sånn som det er i FireFox i IE?

 

her er en Link til siden.....

 

her er koden:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>test</title>
<style>
body {  background-color: #000;
 font-family: verdana;
 font-size: 14px;
 margin-top: 10px;
 margin-left: 0px;}

#linje {	background-color: #223131;
 border-color: #638485;
 border-width: 2px;
 border-style: solid;
 border-left: none;
 position: relative;
 left: 0px;
 height: 200px;
 width: 20px;
 padding-top: 5px;}

.knapp a, knapp a:visited
    {  background-color: #223131;
 color: #7F8385;
 border-color: #638485;
 border-width: 2px;
 border-style: solid;
 width: 100px;
 height: 20px;
 position: relative;
 float: left;
 visibility: visible;
 display: block;
 text-decoration: none;
 font-weight: bold;
 text-align: right;
 margin-top: 5px;
 margin-left: 5px;
 padding-right: 2px;}

.knapp a:hover, knapp a:active
    {  color: #11C7CA;
 background-color: #364E56;
 text-decoration: none;}
</style>
</head>
<body>


<div id="linje">
<div class="knapp">
 <a href="#1">Link1</a>
</div>
<div class="knapp">
 <a href="#1">Link2</a>
</div>
<div class="knapp">
 <a href="#1">Link3</a>
</div>
</div>


</body>
</html>

 

dette er bare testing, jeg har ikke planer om å bruke det som en meny på en side, så jeg trenger ikke kommentarer om hvor stygt det er, dårlige farger osv.

Lenke til kommentar

Videoannonse

Videoannonse
Annonse
IRRupt

IRRupt

Skrevet
Skrevet (endret)

Det du må gøre er å sette dette i body:

 

body { 
margin: 0px;
padding: 0px;
}

 

Så må du tilpasse hver enkelt div med tanke på padding og margin i etterkant. Jeg hadde samme problemet som deg: i FF ble alt vist korrekt, mens IE rotet til alt sammen.

 

 

EDIT: Skriveleif

Endret av IRRupt
Lenke til kommentar
Loomy

Loomy

Skrevet
Skrevet
Det du må gøre er å sette dette i body:

 

body { 
margin: 0px;
padding: 0px;
}

 

Så må du tilpasse hver enkelt div med tanke på padding og margin i etterkant. Jeg hadde samme problemet som deg: i FF ble alt vist korrekt, mens IE rotet til alt sammen.

 

 

EDIT: Skriveleif

Sikker på det ikke er

* {
margin:0;
padding:0;
}

du mener?

 

Ser ikke noen grunn til at body'ens margin eller padding skal skape problemer for denne situasjonen :hmm:

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!

Start en konto

Logg inn

Har du allerede en konto? Logg inn her.

Logg inn nå
Gå til emneliste
×
×
  • Opprett ny...