webForumDet fria alternativet

Bestämd position

14 svar · 601 visningar · startad av Pumba

PumbaMedlem sedan nov. 200468 inlägg
#1

Hej är ganska ny med det här med css,. jag skulle vilja få en box att börja 84pixlar från vänster sida och sedan sluta 642pixlar åt höger, hur löser man detta på bästa sätt? och hur bestämmet man i vilken höjd den ska ligga i?

silfverMedlem sedan apr. 200312 679 inlägg
#2

Så här kanske? :)

CSS:
div.lager {
	position: absolute;
	left: 84px;
	top: 0;
	width: 558px;
}

HTML:
<div class="lager"><p>text</p></div>

r\ Glöm inte att du måste sätta body, html {margin: 0; padding: 0;} också, annars kommer den ha olika placering i olika läsare.

PumbaMedlem sedan nov. 200468 inlägg
#3

jo det fungerade, tack! men nu till nästa problem, varför fungerar inte detta?

div.logo {
position: absolute;
left: 84px;
top: 0
height: 186px;
width: 642px;
background: url(bilder/logo.jpg) no-repeat;
}

dectgapMedlem sedan sep. 20021 655 inlägg
#4

Du har missat ett semikolon efter top: 0.
Om du hade prövat att validera koden hade felet upptäckts direkt.

m_soderlundMedlem sedan sep. 20026 425 inlägg
#5

http://validator.w3.org/ :)

PumbaMedlem sedan nov. 200468 inlägg
#6

Tackar! vad menas med följande fel kod?

Line: 13 Context : div.meny
Invalid number : top only 0 can be a length. You must put an unit after your number : 161

Line: 19 Context : div.sok
Invalid number : top only 0 can be a length. You must put an unit after your number : 161

Line: 26 Context : div.lager
Invalid number : top only 0 can be a length. You must put an unit after your number : 186

div.logo {
position: absolute;
left: 83px;
top: 0;
height: 186px;
width: 642px;
background: url('bilder/logo.jpg') no-repeat;
}

div.meny {
position: absolute;
left: 84px;
top: 161;
width: 642px;
}
div.sok {
position: absolute;
left: 450px;
top: 161;
width: 300px;
}

div.lager {
position: absolute;
left: 84px;
top: 186;
width: 642px;
}

zcorpanMedlem sedan dec. 20042 245 inlägg
#7

Du måste sätta "px" efter varje värde, förutom på 0 där det inte behövs. (0px == 0em == 0% == 0in == 0)

PumbaMedlem sedan nov. 200468 inlägg
#8

hur kunde jag missa det? :D

silfver skrev:

HTML:
<div class="lager"><p>text</p></div>r\ Glöm inte att du måste sätta body, html {margin: 0; padding: 0;} också, annars kommer den ha olika placering i olika läsare.

Vad menar han med att lägga in body, html {margin: 0; padding: 0;}[/. Menar han i html koden eller i css dokumentet?

m_soderlundMedlem sedan sep. 20026 425 inlägg
#9

CSS-filen. :)

PumbaMedlem sedan nov. 200468 inlägg
#10

du menar att det bara är att lägga in BODY {margin: 0; padding: 0;} i css filen? när jag öppnar sidan i IE så visas allt korrekt, men när jag visar den i fiefox så blir allt nerskjutet några pixlar

InsiderMedlem sedan jan. 2000978 inlägg
#11

Skriv såhär:

html, body {margin:0;padding:0;}
PumbaMedlem sedan nov. 200468 inlägg
#12

Det fungerar fin fint i IE, men i firefox så hamnar all text några pixlar nedåt, nån som vet varför?

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>text</title>
<link rel="stylesheet" href="style.css">
</head>

<body background="bilder/bg.jpg">
<div class="logo"></div>
<div class="meny"><p><A href="index.php">Startsidan</A> - <A href="addurl.php">Lägg till länk</A> -
<A href="addcat.php">Lägg till huvudkategori</A></p></div>
<div class="sok"><p><form method="POST" action="sok.php">
Sök :
<input type="text" name="sok" size="20" style="border-style: solid; border-width: 1; padding-left: 4; padding-right: 4; padding-top: 1; padding-bottom: 1">
<input type="submit" value="Sök" name="Sok" style="font-size: 8pt; border-style: solid; border-width: 1; padding-left: 4; padding-right: 4; padding-top: 1; padding-bottom: 1">
</form></p></div>
<div class="lager"><p>text</p></div>
</body>

</html>

html, body {margin:0;padding:0;}

div.logo {
position: absolute;
left: 83px;
top: 0;
height: 186px;
width: 642px;
background: url(bilder/logo.jpg) no-repeat;
}

div.meny {
position: absolute;
left: 84px;
top: 161px;
width: 642px;
}
div.sok {
position: absolute;
left: 450px;
top: 161px;
width: 300px;
}

div.lager {
position: absolute;
left: 84px;
top: 186px;
width: 642px;
}

InsiderMedlem sedan jan. 2000978 inlägg
#13

Det är pga marginalen i ditt textstycke. Dy default har IE och FF olika värden, eftersom du inte har satt nåt värde.

div.meny p {margin-top:0}
PumbaMedlem sedan nov. 200468 inlägg
#14

blir samma fel med:

div.meny {
position: absolute;
left: 84px;
top: 161px;
width: 642px;
div.meny p {margin-top:0}

InsiderMedlem sedan jan. 2000978 inlägg
#15

Du hade glömt en måsvinge:

div.meny {
position: absolute;
left: 84px;
top: 161px;
width: 642px;[b]}[/b]
div.meny p {margin-top:0}
277 ms totalt · 3 externa anrop · v20260731065814-full.3ab8d573
141 ms — hämta forumlista (db)
135 ms — hämta statistik (db)
136 ms — hämta tråd, inlägg och bilagor (db)