Argh! CSS problem (igen)

pakmannenMedlem sedan dec. 2002227 inlägg

16 aug. 2003 23:43#1

http://www.shell.linux.se/cvalda/sbpr/

Bläddra ner på sidan så ser ni felet. Om man använder height: 100% blir det tydligen så. Kan man fixa det på något enkelt sätt?

Här är html-koden:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>
<head>
<title>SBPR</title>
<link rel="stylesheet" href="stylesheet.css" type="text/css" />
</head>

<body>
<div class="center" id="center">

  <!-- TOPBILD -->
  <img src="bilder/top.jpg" alt="SBPR" class="img" />
  <!-- /TOPBILD -->

  <!-- LÄNKAR -->
  <div class="links" id="links">
  &nbsp; &nbsp; &nbsp;
  <a href="" class="menu">Hem</a> | 
  <a href="" class="menu">Er Coach</a> | 
  <a href="" class="menu">Medlemmar</a> | 
  <a href="" class="menu">Kontakt</a> | 
  <a href="" class="menu">Information</a> | 
  <a href="" class="menu">Logga in</a>
  </div>
  <!-- /LÄNKAR -->
	
	
  <!-- MÅNADENS LEDARE -->
  <div class="ledare" id="ledare">
  <p class="bold">Innehållsrik höst</p>

  <p>Bla bla bla...</p>
  </div>
  <!-- /MÅNADENS LEDARE -->

  <!-- NYHETER -->
  <!-- SPALT 1 -->
  <div class="spalt" id="spalt1">

  <p class="bold">Promotionbi-tävlingen igång!</p>
  <p>Bla bla bla</p> 

  <img src="bilder/pixel.gif" width="300" height="1" alt="line"/>

  </div>  
  <!-- /SPALT 1 -->
  <!-- /NYHETER -->

</div>
</body>
</html>

Och här är stylesheet-koden:

html {
height: 100%;
}

body {
background-color: #D2CAB5;
margin: 0px 0px 0px 0px;
height: 100%;
}

.center {
width: 790px;
height: 100%;
background-color: #FFFFFF;
margin: auto;
position: relative;
}

.links {
width: 790px;
height: 12px;
background-color: #022F63;
position: relative;
top: -4px;
padding-top: 4px;
padding-bottom: 4px;

font-family: verdana;
font-size: 10px;
font-weight: bold;
color: #FFFFFF;
}

.ledare {
width: 200px;
height: auto;
background-color: #F1EDE3;
position: absolute;
top: 140px;
left: 550px;
padding: 10px;
border: 1px #C7BCA1 dotted;

font-family: verdana;
font-size: 10px;
color: #000000;
}

.spalt {
width: 300px;
height: auto;
background-color: #FFFFFF;
position: absolute;
top: 140px;
left: 170px;
border: 0px silver solid;

font-family: verdana;
font-size: 10px;
color: #000000;
}

.bold {
font-weight: bold;
}

.img {
position: relative;
}

a.menu:link {
font-family: verdana;
font-size: 10px;
font-weight: bold;
color: #FFFFFF;
text-decoration: none;
}
a.menu:visited {
font-family: verdana;
font-size: 10px;
font-weight: bold;
color: #FFFFFF;
text-decoration: none;
}
a.menu:active {
font-family: verdana;
font-size: 10px;
font-weight: bold;
color: #FFFFFF;
text-decoration: none;
}
a.menu:hover {
font-family: verdana;
font-size: 10px;
font-weight: bold;
color: #FFFFFF;
text-decoration: underline;
}

NickemannenMedlem sedan aug. 20003 575 inlägg

16 aug. 2003 23:58#2

Sätt text lagret till relative istället.

pakmannenMedlem sedan dec. 2002227 inlägg

17 aug. 2003 07:10#3

Jo, en annan sak också, innan hade jag allt relative, men hur får man grejer att ligga bredvid varandra istället för nedanför? Jag kommer ihåg att det var något man kunde skriva för det.

pakmannenMedlem sedan dec. 2002227 inlägg

17 aug. 2003 08:41#4

Det blir liksom så här om man använder relative:
http://www.shell.linux.se/cvalda/sbpr/

EDIT: Och varför kapas den nedre rutan av förresten? Nu när jag testat lite så kapas den långa texten också av om jag flyttar upp rutan till vänster. Vad händer här egentligen?

pakmannenMedlem sedan dec. 2002227 inlägg

17 aug. 2003 09:19#5

Okej, nu tror jag jag fattar vad det är som är fel, men jag vet fortfarande inte varför:
http://www.shell.linux.se/cvalda/sbpr/index2.html

Tydligen är det så för att jag har top:140px till text-div:en, men så borde det ju inte bli! Vad är det som är fel! (Har lite bråttom också, till råga på allt. Måste bli klar idag.. Börjar få lite panik här..) :)

EDIT: Det fungerar om man använder padding. Men varför inte när man använder top?