Positionering

Börja med att separera html och css i olika kod-taggar. [html]-tagg för din html och [kod]-tagg för css.

okok vet inte hur man gör de bara?

axionman skrev:

okok vet inte hur man gör de bara?

Markera din html-kod och klicka på knappen som ser ut som två < > så kommer den omsluta all din html-kod med en html-tagg.

För din css-kod gör likadant, fast du klickar på knappen #.

tackar

axionman skrev:

tackar

Så. Nu blir det mycket lättare att tolka koden. :)

I din css så ser jag flera fel. Du har bland annat missat måsvingar i första blocket, dessutom saknar du semikolon lite här och var. Börja med att rätta till det.

Ditt första kodblock saknar dessutom värde, eller vad skall den här koden gälla på? Ändra detta:

border-right:1px solid white;
margin-top: 10px;
background-repeat: no-repeat;
background-position: bottom

}

Till:

body? {border-right:1px solid white; /* Där frågetecknet givetvis inte skall vara med */
margin-top: 10px;
background-repeat: no-repeat;
background-position: bottom[B];[/B]
}

Du kan skriva så här också:

#meny1 p input {margin: 0; padding: 0;}

nu ser koden ut så här.

body {
background-color:gray;
border-right:1px solid white; 
margin-top: 10px;

}

#header {
width: 768px;
height: 70px;
background-color:#696969;
border:3px solid white;
margin-bottom: 10px;
}

}

#lager1 {
width:768px;
height:800px;
background-color:#696969;
border-top:3px solid white;
border-bottom:1px solid white;
border-left:1px solid white;
border-right:1px solid white;
margin-top: 10px;
background-repeat: no-repeat;
background-position: bottom;

}

#textframe {
width:500px;
height:100px;
border:1px solid white;
background-color:#696969;
float:right;
margin-right:50px;
margin-top:5px;
}

#meny1 {
width:120px;
height:200px;
background-color:#2F4F4F;
border:1px solid white;
margin-bottom: 5px;
margin-top: 5px;
margin-left: 5px;

}

#meny2 {
width:120px;
height:250px;
background-color:#2F4F4F;
border:1px solid white;
margin-top:5px;
margin-left:5px;

}

#select {
margin-left:10px;
}

p1 {

}

.form {
height:18px;
width:60px;
margin-left:30px;
}

.headmenytitle {
font-size:15px;
color:gray;
margin-top:5px;
margin-left:5px;

}

silfver skrev:

Du kan skriva så här också:

#meny1 p input {margin: 0; padding: 0;}

Ok jag förstår inte riktigt?

axionman skrev:

Ok jag förstår inte riktigt?

Jag menar inte att du skall ersätta all din css med mitt förslag, utan du ska bara lägga till den koden. Då kommer dina p-taggar och inputfält inte ha några marginaler eller paddings, och då kommer de att ligga närmre varann, så som du ville. Eller hur var det? :)

aha. ja de var så jag ville ha det. tack så mycket. Men när jag gjorde så sa kom det in en ny ruta plus att allt la sig längre ner.

Jag börjar bli lite osäker på hur du vill ha det. Men pröva ersätta din <form-kod> med följande:

<form>
<p>Username<br />
<input type="text" name="name" class="form"</p>
<p>Password<br />
<input type="password" name="Password" class="form"></p>
</form>

alltså allting lägger sig under varannat. E skitstörigt. Plus att det har kommit upp en ny rektangel som skjuter ner allt. Det ligger inte i vartannat

jag tog nu bort det du skrev efter. Det "p input"
Och nu fungerar det.

okok det blev bättre men jag skulle vilja tighta till allt mer. Sen ligger de nog centrerat också? men jag kan ha fel där. Men i alla fall lite tightare mellan allt hade inte skadat. hur gör man detta?

silfver skrev:

Jag börjar bli lite osäker på hur du vill ha det. Men pröva ersätta din <form-kod> med följande:

<form>
<p>Username<br />
<input type="text" name="name" class="form"</p>
<p>Password<br />
<input type="password" name="Password" class="form"></p>
</form>

Du glömde stänga översta inputen. Sen så finns det väl ingen anledning att ha p-taggar där alls, eller?. Slutligen brukar en del webbläsare lägga till marginaler till form-taggar, så man måste nolla i CSS:

<form>
Username<br />
<input type="text" name="name" class="form"><br />
Password<br />
<input type="password" name="Password" class="form">
</form>

form {
margin:0px
}

okok nu ser jag. jag löste det. hehe. tack för all hjälp. vet inte vad jag hade gjort utan er. jag tog bort <p> så löste de sig. Vet inte varför jag satt in den?

hej jag har en fråga till. Om man har en egen bild som man vill ha som submit knapp. Alltså en inloggningsknapp. Hur gör man då? Jag har följande.

<a href="#"><img src="loggain.gif" style="border:0px" /></a>

axionman skrev:

hej jag har en fråga till. Om man har en egen bild som man vill ha som submit knapp. Alltså en inloggningsknapp. Hur gör man då? Jag har följande.

<a href="#"><img src="loggain.gif" style="border:0px" /></a>

Nej, det där är en vanlig länk. Formuläret måste få en order om att skicka informationen och det får det bara om skicka-länken ser ut på ett speciellt sätt:

<input type="image" src="loggain.gif" height="20" width="100" border="0" alt="Logga in!" />

Ändra det som passar dig.

EDIT: Oooops... jag glömde "stänga" taggen med den där slashen på slutet.

tack så jättemycket. Men du behöver jag ha med height och width?
tack än en gång.

Danne V skrev:

Du glömde stänga översta inputen. Sen så finns det väl ingen anledning att ha p-taggar där alls, eller?. Slutligen brukar en del webbläsare lägga till marginaler till form-taggar, så man måste nolla i CSS:

<form>
Username<br />
<input type="text" name="name" class="form"><br />
Password<br />
<input type="password" name="Password" class="form">
</form>

form {
margin:0px
}

Jag tycker att det blir snyggare så när man stänger av stilmallarna. :)