hmm jag tror det.. jag sitter just nu o behandalar dom koderna ni skrev tidigare och testar mig fram :D
tack!
Problem med CSS i IE.
25 svar · 938 visningar · startad av Dirre · sida 2 av 2
Frågan, av Dirre
Hejsan! Jag har sökt men hittade inte direkt det jag sökte. Det är så att jag har gjort en sida helt i CSS och XHTML. Den validerar osv. Jag har hört att Firefox ska vara hårdare "typat" när det gäller CSS. Så därför använde jag mig av FF för att kolla på sidan under arbetets gång. Men när jag kollade på sidan i IE såg den ut som en katastrof. [Så den ska se ut!](http://condac.tfqnet.com//mkshit
Läs frågan i sin helhet →när man använt sig av float:left. måste man då skriva något på det som kommer "under". För det är så att det som kommer efter (under) visas inte som det ska eller kronglar. beror på vilken webbläsare.. tacksam för hjälp!
när man använt sig av float:left. måste man då skriva något på det som kommer "under".
man måste nolla marginalerna .. ja
clear:left; clear:right; eller clear:both;
tack... antar att jag ska använda mig av clear:left; för det är så att jag har 3 div-ar som det är float:left; i och det som kommer efter visas jätte konstigt.. det försvinner osv.. :/ eller det ser bra ut i IE men inte i FF... får testa mig fram då :D
Edit:
Efter jag skrev in clear:left; så vart den som ett mellanrum under den div-en som jag inte vill ha!...
Edit2:
Lyckades visst fixa det själv.!
:)
Hur går det?
Gjorde det enklast möjliga css:en för din design och cayas html...med bara float:left...utan clear
Färgade varje div med en bakgrundsfärg...
Oftast blir det fel på det man har efter en float när man inte har satt någon vidd på den.
Om du vill så kopiera in den i ett nytt dokument.
Kommentera bort den översta i css:en *{} och se skillnaden.
Bra att bestämma sig redan från början om man ska låta webläsarna bestämma sina margin och padding, eller om man själv ska ha kontrollen på det.
Enklast tycker jag det är att bestämma själv...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="sv" lang="sv">
<head>
<title>test</title>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
<style type="text/css">
<!--
*{
margin:0px;
padding:0px;
}
body{
margin:0px;
width:100%;
color:#FFF;
background:#12335B;
font:11px Verdana,Arial,Helvetica,sans-serif;
text-align:center;
}
#wrapper{
width:564px;
margin-left:auto;
margin-right:auto;
}
#logo{
width:100%;
float:left;
background:#808080;
}
#menu{
width:100%;
float:left;
background:#000;
height:30px;
}
#news{
width:190px;
float:left;
background:#0FF;
height:auto;
}
#match{
width:190px;
float:left;
background:#9370DB;
height:auto;
}
#players{
width:180px;
padding:2px;
float:left;
background:#2A2BBE;
height:auto;
}
#players img{
float:left;
padding:4px;
width:45px;
height:30px;
}
#main{
width:100%;
float:left;
background:#008000;
text-align:left;
height:auto;
}
#main h2{
color:#0F0;
;text-align:center;
}
#main p{
margin-left:10px;
}
#botten{
width:100%;
float:left;
background:#8FBC8F;
height:30px;
}
-->
</style>
</head>
<body>
<div id="wrapper">
<div id="logo">
<h1>#Gross Online</h1>
<h2>Fyndig slogan med relevanta sökord</h2>
</div>
<div id="menu">en meny med knapparna som bakgrund</div>
<div id="news">
<h3>Nyheter</h3>
<ul>
<li>test</li>
<li>test</li>
<li>test</li>
<li>test</li>
<li>test</li>
</ul>
</div>
<div id="match">
<h3>Matcher</h3>
<ul>
<li>test</li>
<li>test</li>
<li>test</li>
<li>test</li>
<li>test</li>
</ul>
</div>
<div id="players">
<h3>Spelare</h3>
<p><img src="_gfx/players_player1.png" alt="" />
<img src="_gfx/players_player2.png" alt="" />
<img src="_gfx/players_player3.png" alt="" />
<img src="_gfx/players_nopic.png" alt="" />
<img src="_gfx/players_nopic.png" alt="" />
<img src="_gfx/players_nopic.png" alt="" /></p>
</div>
<div id="main">
<h2>Välkommen till #Gross Online!</h2>
<p>Bla bla bla</p>
<p>Bla bla bla</p>
<p>Bla bla bla</p>
<p>Bla bla bla</p><p>Bla bla bla</p>
<p>Bla bla bla</p><p>Bla bla bla</p>
<p>Bla bla bla</p>
</div>
<div id="botten"></div>
</div>
</body>
</html>
jo då det har gått helt okej efter eran underbara hjälp :D
men det som stör mig är att dem olika webbläsarna läsar av pixel-värdena olika vilket leder till att det kan se lite konstigt ut i vissa läsare... :/
nu ska jag kolla genom det sista tanten posta :D