---
title: "Vänsterställda inputfält"
type: "forum-thread"
url: "https://www.webforum.nu/amne/html-css/168576-vänsterställda-inputfält"
topic: "HTML & CSS"
topic_url: "https://www.webforum.nu/amne/html-css"
author: "MickeA.com"
published: "2008-01-30T10:13:52.000Z"
updated: "2008-01-30T18:13:56.000Z"
replies: 11
views: 604
page: 1
pages: 1
language: "sv-SE"
site: "webForum — webforum.nu"
rights: "Upphovsrätten till varje inlägg tillhör dess författare."
attribution: "Citera som: webForum, https://www.webforum.nu/amne/html-css/168576-vänsterställda-inputfält"
---

# Vänsterställda inputfält

## #1 — MickeA.com, 2008-01-30T10:13Z

Morrn',
Jag har ett konstigt problem med ett formulär.
Det är så att varje fält ligger i p-element enl. följande:

```
<p class="float-left width-200px"><strong>E-mail:</strong><sup class="reg-form">*</sup><br />
<input type="text" class="form-field" name="usermaila" /></p>
```

Problemet är att jag precis upptäckte att inputfälten blir centrerade i IE7.
I Firefox / Opera blir det rätt, se bilderna nedan.

När jag kollar vilken css som "hör" till objektet med hjälp av Firebug, får jag det här:

```
element.style {
	text-align:	left;
}
div#box-signup-form p, div#box-signup-form p input.form-field {style-default.css (line 328)
	line-height:	2em;
	text-align:	left;
}
	div#content p {style-default.css (line 238)
	line-height:	1.8em;
}
.width-200px {style-default.css (line 630)
	width:		200px;
}
.float-left {style-default.css (line 618)
	float:		left;
}
```

Jag har testat att sätta style direkt på *\<p\>*, men det blir ändå inte vänsterställt.

Vad kan det här bero på?

Har läst lite andra trådar om det här i forumet, men dessa rör centreringsproblem, där float: left har använts, som på så sätt "override'ar" centreringen.
Det är inte riktigt samma problem som jag upplever.

Tack!

Permalänk: https://www.webforum.nu/p/168576

## #2 — @nders, 2008-01-30T10:50Z

> **MickeA.com skrev:**
>
> I Firefox / Opera blir det rätt, se bilderna nedan.

Jag ser inga bilder.

Kan du inte ge oss en url?

Permalänk: https://www.webforum.nu/p/2076574

## #3 — MickeA.com, 2008-01-30T11:41Z

> **@nders skrev:**
>
> Jag ser inga bilder.

Ojdå, glömde dom... Kolla här nedanför...

> **@nders skrev:**
>
> Kan du inte ge oss en url?

Nej tyvärr, sitter på en utvecklings server som inte är nåbar utifrån.

Bilagor:

- [dump.ff2.png](https://www.webforum.nu/a/17051.png)
- [dump.ie7.png](https://www.webforum.nu/a/17052.png)

Permalänk: https://www.webforum.nu/p/2076584

## #4 — @nders, 2008-01-30T11:49Z

> Nej tyvärr, sitter på en utvecklings server som inte är nåbar utifrån.

Och det går inte att ladda upp en kopia av html-koden någonstans - till exempel på webForum?

Permalänk: https://www.webforum.nu/p/2076585

## #5 — MickeA.com, 2008-01-30T11:59Z

Här är det kodblock det gäller:

```
<div class="clear-row height-null"><a name="signup-step-1">&nbsp;</a></div>
<div class="fpo-header"><p class="fpo-topic" style="margin-left: 40px;">Sign up as a new customer</p></div>
<div class="clear-row height-10px">&nbsp;</div>
<form id="signup-form" action="signup-adduser.php" method="post">
<div id="box-signup-form" style="margin: 30px 40px 0px 40px;">
<p class="float-left width-200px" style="text-align: left;"><strong>Username:</strong><sup class="reg-form">*</sup><br />
<input type="text" class="form-field" name="username" /></p>
<p class="clear-row height-10px">&nbsp;</p><p class="float-left width-200px"><strong>E-mail:</strong><sup class="reg-form">*</sup><br />
<input type="text" class="form-field" name="usermaila" /></p>

<p class="float-left width-200px"><strong>Confirm E-mail:</strong><sup class="reg-form">*</sup><br />
<input type="text" class="form-field" name="usermailb" /></p>
<p class="clear-row height-10px">&nbsp;</p><p class="float-left width-200px"><strong>Password:</strong><sup class="reg-form">*</sup><br />
<input type="password" class="form-field" name="passwda" value="" /></p>
<p class="float-left width-200px"><strong>Repeat password:</strong><sup class="reg-form">*</sup><br />
<input type="password" class="form-field" name="passwdb" value="" /></p>
<p class="clear-row height-10px">&nbsp;</p><p class="float-left width-200px"><strong>Firstname:</strong><sup class="reg-form">*</sup><br />
<input type="text" class="form-field" name="firstname" /></p>
<p class="float-left width-200px"><strong>Lastname:</strong><sup class="reg-form">*</sup><br />

<input type="text" class="form-field" name="lastname" /></p>
<p class="float-left width-200px"><strong>Phone:</strong><sup class="reg-form">*</sup><br />
<input type="text" class="form-field" name="userphone" /></p>
<p class="clear-row height-10px">&nbsp;</p><p class="float-left width-200px"><strong>Address:</strong><sup class="reg-form">*</sup><br />
<input type="text" class="form-field" name="addr" /></p>
<p class="float-left width-200px"><strong>Zipcode:</strong><sup class="reg-form">*</sup><br />
<input type="text" class="form-field" name="postnum" /></p>
<p class="float-left width-200px"><strong>City:</strong><sup class="reg-form">*</sup><br />
<input type="text" class="form-field" name="postaddr" /></p>

<p class="clear-row height-10px">&nbsp;</p><p class="float-left width-200px"><strong>Country:</strong><sup class="reg-form">*</sup><br />
<select name="country">
<option value="">(Choose country)</option><option value="US">United States</option>
</select>
</p>
<p class="clear-row height-10px">&nbsp;</p><p class="float-left width-500px"><input type="checkbox" name="accept-tac" />&nbsp;&nbsp;&nbsp;Please accept our <a href="#" onclick="exec('terms', 'footer'); return false;">Terms and Conditions</a> and <a href="#" onclick="exec('privacy', 'footer'); return false;">Privacy Policy</a><sup class="reg-form">*</sup></p>
<p class="clear-row height-20px">&nbsp;</p><p class="float-left">
<input type="hidden" name="passthrough" value="false" />
<input type="hidden" name="step2" value="true" />
<input type="hidden" name="onerror" value="restartSignup" /><input type="hidden" name="regsite" value="false" /><input type="submit" class="form-button" value="Submit" /></p>
</div>
</form>
```

Permalänk: https://www.webforum.nu/p/2076586

## #6 — @nders, 2008-01-30T12:01Z

Ok. Om du inte kan fixa något som går att se på, så kan iaf inte jag hjälpa dig. Hoppas någon annan kan.

Permalänk: https://www.webforum.nu/p/2076587

## #7 — MickeA.com, 2008-01-30T12:54Z

> **@nders skrev:**
>
> Ok. Om du inte kan fixa något som går att se på, så kan iaf inte jag hjälpa dig. Hoppas någon annan kan.

Okej, här är den fullständiga signup-filen, eller all den HTML kod som genereras utifrån mina php filer.

Bilagor:

- [rmn.signup.account.htm.txt](https://www.webforum.nu/a/17055.txt)

Permalänk: https://www.webforum.nu/p/2076593

## #8 — @nders, 2008-01-30T13:00Z

Har du tittat på hur det där ser ut i en webbläsare?
Jag är helt enkelt ute efter html-kod som renderas som i din bild ovan. Om jag öppnar det där i webbläsare blir allt bara misär. :)

Men som sagt - det finns säkert andra som kan hjälpa dig - jag är på intet sätt proffs i detta ämne.

Permalänk: https://www.webforum.nu/p/2076596

## #9 — MickeA.com, 2008-01-30T13:16Z

Okej, då testar vi igen:
<http://www.rakemenot.com/rmn.signup.account.htm>

Nu importeras CSS osv. precis som om det hade varit "på riktigt".

Permalänk: https://www.webforum.nu/p/2076597

## #10 — phred, 2008-01-30T15:19Z

{display:inline} på input ?

Permalänk: https://www.webforum.nu/p/2076609

## #11 — MickeA.com, 2008-01-30T17:35Z

> **phred skrev:**
>
> {display:inline} på input ?

Nej tyvärr fungerade inte det, fler förslag?

Tack!

Permalänk: https://www.webforum.nu/p/2076623

## #12 — jarvklo, 2008-01-30T18:13Z

Hmm...

Om du vill ha råd från en gammal inbiten Gnagare så :e

Det verkar inte vara någon centrering du råkar ut för...
Fenomenet verkar uppkomma pga marginalen du sätter i containerdiven inuti formuläret  - dvs

```
<div id="box-signup-form" style="[b]margin[/b]: 30px 40px 0px 40px;">
```

tydligen ärvs vänstermarginalen om 40px av\<input\> i MSIE (eller i varje fall "propagerar" ner till den när den ligger efter en \<br /\>).

Byt ut margin mot padding i den divven så slipper du problemet 

```
<div id="box-signup-form" style="[b]padding[/b]: 30px 40px 0px 40px;">
```

(det funkade i MSIE7 när jag testade lokalt ivf ;) )

Permalänk: https://www.webforum.nu/p/2076632

---

Tråden på webben: https://www.webforum.nu/amne/html-css/168576-vänsterställda-inputfält