Avatar billede MLundager Nybegynder
11. november 2010 - 15:31 Der er 16 kommentarer

Css Textbox problem

Hej jeg er ved at lave en hjemmeside med css. og har sat nogen textboxes op men når jeg minimere browseren følger textboxene med...

er der nogen der kan hjælpe?
Avatar billede claes57 Ekspert
11. november 2010 - 15:36 #1
tekstbokse kan angives i % og i px.
i % følger de sidens skalering - det gør de ikke med px.
Avatar billede MLundager Nybegynder
11. november 2010 - 15:38 #2
her er min kode kan du vise mig hvordan den skal se ud

#user_pass{
position:absolute;
top:190px;
left:537px;
}
Avatar billede claes57 Ekspert
11. november 2010 - 16:04 #3
skift # ud med .

<body>
<div class="user_pass">
adgangskode <input type="text" name="demo" size="15">
</div>
</body>

den flytter sig først når siden er mindre, så der ikke længere er plads til txtbox.
Avatar billede webweaver Praktikant
11. november 2010 - 16:36 #4
Om du har # eller . er ligemeget.
Hvis du vil bruge id skal du bruge #, men hvis du vil bruge class skal du bruge punktum. Class bruges som regel til en style som går igen flere steder. Id er unik, og bruges kun 1 sted.

Bliver boksen mindre eller flytter de sig, efterhånden som du minimerer sitet? De vil flytte sig, som claes57 også siger, så snart der ikke er plads nok længere, og omkringstående elementer skubber til dem.

Udover det bør du også give din div en width og height, hvis du vil holde den i en fast størrelse. P.t. har du kun angivet dens position.
Avatar billede MLundager Nybegynder
11. november 2010 - 16:55 #5
Jeg fandt ud af at det ikke var noget med textboxene men billedet som ikke passede til browseren hvordan kan jeg få billedet til at passe til alle skærm størrelser?
Avatar billede claes57 Ekspert
11. november 2010 - 17:45 #6
jeg ville nok vælge at lave en (lille) div centreret på siden, og i den have baggrundsbillede - udenom så bare en farve der passer til.
Den centrale div har så fast størrelse, og billedet er tilpasset denne.
der er ikke - som jeg læser det - en mulighed for at skalere et baggrundsbillede
http://www.w3.org/TR/CSS2/colors.html#background
Avatar billede webweaver Praktikant
11. november 2010 - 18:09 #7
Billedet som ikke passer til browserne?
Prøv at uddyb det noget mere, tak? :)

Vi skal fastslå 1 ting først. Snakker vi om en baggrund eller et billede? Det er 2 forskellige ting, og de opfører sig meget forskelligt. En baggrund ændrer ikke på nogle elementer på sitet. En baggrund vil ikke skabe scroll. Den tilpasses bare til browseren automatisk. Hvis baggrundsbilledet er for småt, kan man bruge repeat funktion i CSS til at gentage baggrundsbilledet.
Avatar billede MLundager Nybegynder
11. november 2010 - 18:18 #8
Det er ikke en baggrund det er et billede
Avatar billede claes57 Ekspert
11. november 2010 - 18:22 #9
vi vil gerne have dimensioner på billede, samt en kopi af hele den kode, den skal være i.
Du kommer ikke med brugbare oplysninger - og vi gider ikke gætte mere.
Avatar billede MLundager Nybegynder
11. november 2010 - 18:40 #10
index.php:

<div id="board">
<img class="board" src="Images/Board.png" />
</div>
<center>

<div id="fullname">
<input type="text" name="fullname" />
</div>

<div id="email">
<input type="text" name="email" />
</div>

<div id="password">
<input type="password" name="password" />
</div>

<div id="user_email">
<input type="text" name="user_email" size="12" />
</div>

<div id="user_pass">
<input type="password" name="user_pass" size="12" />
</div>

<div id="user_login">
<input type="submit" name="user_submit" value="Login" />
</div>

_________________________________________________________________
styles.css:

body
{

}

#board img.board {
position:absolute;
bottom:60px;
left:88px;

}

#country {
position:absolute;
top:410px;
right:140px;
}

#fullname {
position:absolute;
top:280px;
right:150px;
}

#email {
position:absolute;
top:323px;
right:150px;
}

#password {
position:absolute;
top:365px;
right:150px;
}

#user_email{
position:absolute;
top:190px;
left:405px;
}

#user_pass{
position:absolute;
top:190px;
left:537px;
}

#user_login {
position:absolute;
top:238px;
right:470px;
}
Avatar billede MLundager Nybegynder
11. november 2010 - 18:42 #11
billedet er 970x750
Avatar billede webweaver Praktikant
11. november 2010 - 20:33 #12
Og hvad er det som du ønsker at opnå, når du siger at billedet ikke passer til alle skærmstørrelser?

Har du evt. et link?

Du kan jo prøve at angive width og height på dit billede i % og se om det ikke hjælper dig.
Avatar billede claes57 Ekspert
11. november 2010 - 20:38 #13
glem billedet - skal login-knappen sidde så fjollet - prøv lige at køre denne side (dine data).

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<style type="text/css">
body {
  background: #e0e0e0;
  text-align: center;
}
#board img.board {
position:absolute;
bottom:60px;
left:88px;

}

#country {
position:absolute;
top:410px;
right:140px;
}

#fullname {
position:absolute;
top:280px;
right:150px;
}

#email {
position:absolute;
top:323px;
right:150px;
}

#password {
position:absolute;
top:365px;
right:150px;
}

#user_email{
position:absolute;
top:190px;
left:405px;
}

#user_pass{
position:absolute;
top:190px;
left:537px;
}

#user_login {
position:absolute;
top:238px;
right:470px;
}

</style>
</head>
<body>
<div id="board">
<img class="board" src="Images/Board.png" />
</div>
<center>

<div id="fullname">
Fulde navn <input type="text" name="fullname" />
</div>

<div id="email">
Email <input type="text" name="email" />
</div>

<div id="password">
Adgangskode <input type="password" name="password" />
</div>

<div id="user_email">
bruger email <input type="text" name="user_email" size="12" />
</div>

<div id="user_pass">
bruger adgangskode <input type="password" name="user_pass" size="12" />
</div>

<div id="user_login">
<input type="submit" name="user_submit" value="Login" />
</div>

</body>
</html>


jeg kan ikke finde hoved og hale i den - HJÆLP!
Avatar billede webweaver Praktikant
11. november 2010 - 20:50 #14
Jeg har lige prøvet at oprette en test fil med koden.
Ved ikke hvordan du ønsker at sætte det op selvfølgelig, men det ser ikke for godt ud hos mig ihvertfald.

http://www.lasse-jensen.dk/eksperten/mlundager.jpg

Men igen tilbage til billedet. Det er trods alt det som du vil have hjælp til :-)
Avatar billede MLundager Nybegynder
11. november 2010 - 21:08 #15
jeg har fået billedet til at virke nu men mit problem er at når jeg scroller igennem websiden følger textboxene med
Avatar billede webweaver Praktikant
11. november 2010 - 21:17 #16
Lyder meget underligt. Gør de ikke med absolute position normalt.
Du har stadig ikke noget link til siden? Det er svært at hjælpe dig.
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Kurser inden for grundlæggende programmering

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester