Mere luft om tekst i input-felt

text-indent:2px ?

Jeg kan ikke få det til at virke.
Min CSS ser sådan her ud:

div.form {
    border: 0px;
    text-indent:3em;
}

Jeg har også prøvet med "3px".

Gør jeg det forkert?

<ole>

<input style="border:0;padding:3px" type="text">

/mvh
</bole>

- eller:
    <input style="border:0;padding-left:3px" type="text">

ja jeg testede også lige og kan se den kun tager imod padding.
dog synes jeg ikke "padding:3px" gav mig samme antal på alle sider.
men du kan sætte padding-left, right og bottom selv.

Super - padding-left var løsningen.

Hvorfor virker det ikke, når jeg definerer det i min "div.form" i CSS.

Det danner luft indenfor div'et - mens det, du ønsker, er luft indenfor input-elementet  ;o)

Det er sikkert lettere at se med border på inputtet:
    <div style="padding:20px"><input type="text"></div>
    <div><input style="padding:20px" type="text"></div>

OK - så er jeg med.
Vil kalp også have point, så send venligst et svar.

olebole: Nemlig ja. :)

det er okay:) jeg var for langsom med at indsætte mit padding svar:)

kalp >> text-indent er formodentlig ligeså virksom, hvis den bliver lagt på inputtet (har ikke testet, men er ret sikker) - så jeg synes, du skal lægge et svar, så vi kan dele  ;o)

Hmm ... jeg kan godt se, IE har en bug omkring anbringelsen af cursor'en - men ellers virker det ... og de andre browsere har ikke denne bug. Jeg vil stadig gerne dele  ;o)

hvis mit svar er gyldigt så er det okay:)

Jeg testede i EditPlus.. min standard browser er FF, men EditPlus indbyggede må være Internet Explorer den integrere:) det var derfor jeg synes den fejlede:)

Kalp - så mangler jeg bare dit svar?
Jeg fandt også noget på nettet om text-indent, og synes også det burde virke. Jeg har prøvet at lægge det på inputtet, men det virker ikke hos mig, og jeg anvender IE 7.0.

Når man klikker i dette input i IE, sættes cursoren i begyndelsen af feltet - men der skrives 20px inde => bug!
    <input type="text" style="text-indent:20px">

I de andre browsere, jeg lige har testet i, sættes cursoren korrekt 20px inde, hvor der også skrives.

olebole >>
Jeg tror i øvrigt den gælder flere af elementerne i IE.
Jeg sad for et par dage siden og ville sætte indent på nogle option elementer i en dropdownbox.
Her virker text-indent helt fint i FireFox, men ikke i IE.
Der løste jeg det (på en lidt grim måde), men ved og skrive '  ' foran min tekst, som erstatning for text-indent til IE.

Heldigvis så ignorere FF dette:) dvs. den dobbelt indentede ikke og dermed fungerede mit "indent" i begge browsere:)

Select elementer er helt specielle og er meget forskellige konstruktioner i de forskellige browsere, så der kan man aldrig være helt sikker på, hvad der sker ... men det _kan_ godt være samme fænomen  =)

- og begynder man så at blande DOM ind i eventyret, åbner der sig uanede muligheder for sære scenarier. Har du stærke nerver, kan du teste dette i forskellige browsere (Pas på FF! Det kræver mental styrke i eksorbitant grad!)  =8-O

<script type="text/javascript">
function fooBar() {
    var oTbl = document.getElementById("bar");
    var oSel = document.getElementById("foo");
    var oOpt = oSel.getElementsByTagName("option")[2];
    oOpt.appendChild(oTbl.cloneNode(true));
}
</script>

<select id="foo">
    <option>En tekst #1</option>
    <option>En tekst #2</option>
    <option>En tekst #3</option>
    <option>En tekst #4</option>
    <option>En tekst #5</option>
    <option>En tekst #6</option>
</select>

<table id="bar">
<tbody>
<tr>
    <td>En lille tekst ...</td>
    <td><img src="http://www.eksperten.dk/img/elogo.png" alt="E-Logo"></td>
</tr>
<tr>
    <td><img src="http://www.eksperten.dk/img/elogo.png" alt="E-Logo"></td>
    <td>En lille tekst ...</td>
</tr>
</tbody>
</table>

<p><button onclick="fooBar()">TEST</button></p>

- og tak for points  *<|;o)

Jeg tjekkede først i IE og efterfølgende i FF.
Blev da lige overrasket over forskellen:D