[CSS] Probleem met input text en css

[Jo3p789]

Simpel probleem, waarschijnlijk simpele oplossing, maar ik loop me helemaal suf te zoeken, en niks werkt.

Ik heb een textveld in een fieldset in een form. Dat textveld wil ik met css aanpassen, maar ik krijg het niet aangeroepen. Vereenvoudigd voorbeeld:

<form>
<fieldset>
<input type="text">
</fieldset>
</form>

Hoe roep ik dit textveld (en alle andere) nu aan in css?

Wat ik heb geprobeerd, en wat allemaal als oplossing (via Google) werd gemeld:

input text {
input txt {
input.text {
input.txt {
input fieldset text {
input fieldset txt {
input.fieldset.text {
input.fieldset.txt {
etc.

Kan iemand me alsjeblieft vertellen wat de juiste code is? I'm out of options...

Alvast bedankt!

Heras

[Snake]

gewoon

Cascading Stylesheet:

input { background-color:#000000; } 

( http://www.sitepoint.com/article/style-web-forms-css )

?

[XWB]

Dan heb je niet goed gezocht

Cascading Stylesheet:

input.text { // opmaak }

HTML:

<input type="text" class="text">

@snake903, daarmee worden alle input elementen aangepast.

[Jo3p789]

Het gaat me om de breedte van textvelden, die wil ik veranderen, alleen voor textvelden. Met deze code maak ik ook radiobuttons e.d. even breed als textvelden.

[Jo3p789]

input.text heb ik geprobeerd (staat ook in mijn lijstje) maar werkt gewoon niet...

Zelfs niet met het bovengenoemde kale voorbeeld. Niet in IE en niet in FF...

Of is mijn computer toe aan een nieuwe installatie?

[crisp]

Cascading Stylesheet:

input[type=text] { }

werkt in alle moderne browsers (niet in IE < 7 dus )

[XWB]

Jo3p schreef op zaterdag 12 augustus 2006 @ 00:08:
input.text heb ik geprobeerd (staat ook in mijn lijstje) maar werkt gewoon niet...

Zelfs niet met het bovengenoemde kale voorbeeld. Niet in IE en niet in FF...

Of is mijn computer toe aan een nieuwe installatie?

Werkt wel, je moet alleen even een class meegeven aan je element, zoals ik gedaan heb.

[Jo3p789]

Dankjewel, iets nieuws geleerd

Helaas niet de oplossing voor mijn probleem in 2006...

[Jo3p789]

Okay, class meegeven. Ga ik toepassen. Dankjewel!

Maarre, even theoretisch, kan het echt niet netter, rechtstreeks?

[Snake]

Jo3p schreef op zaterdag 12 augustus 2006 @ 00:11:
Okay, class meegeven. Ga ik toepassen. Dankjewel!

Maarre, even theoretisch, kan het echt niet netter, rechtstreeks?

Ik vind een class juist netjes-er, zo kan je meerdere input velden verschillende opmaak geven (required en non-required ofzo...)

[XWB]

Nee, tenzij je crisp zijn voorbeeld gebruikt (maar dan sluit je oude browsers buiten), of via input { } alle input elementen een style geeft. Maar zoveel werk is dat toch niet om een class aan je elementen mee te geven?

[ Voor 10% gewijzigd door XWB op 12-08-2006 00:17 ]

[Jo3p789]

Class meegeven is netjes genoeg, en inderdaad niet heel veel werk, maar ik vroeg me gewoon af waarom het in de basis niet mogelijk is om zonder extra HTML-argumenten met css een textveld aan te roepen, terwijl dit met (voor zover ik weet) alle andere HTML-objecten wel kan.

Vandaar dat ik het vanuit de theorie vroeg.

Maar ik kan verder, bedankt, u allen, voor uw hulp!

Groet,

Jo3p

(weekend? never heard of...)

[GateKeaper]

Hoezo niet mogelijk zonder extra html? In je css roep je toch elk element aan aan de
hand van zijn class? Zo ook de input.

Ik las dat je het gebruikt voor de breedte van je input. Hier ben ik momenteel ook
mee aan het prutsen. Het schijnt dat je in css width moet gebruiken, en geen size.

Ook schijnt het dat het niet in oudere browsers ondersteund word. Weet iemand
hier iets van? Ter verduidelijking, ik heb het dus over de "width" in mijn layout.css.
Niet over de size in een html doc.

Greetz,

[Jo3p789]

GateKeaper schreef op zaterdag 12 augustus 2006 @ 00:34:
Hoezo niet mogelijk zonder extra html? In je css roep je toch elk element aan aan de
hand van zijn class? Zo ook de input.

Ik las dat je het gebruikt voor de breedte van je input. Hier ben ik momenteel ook
mee aan het prutsen. Het schijnt dat je in css width moet gebruiken, en geen size.

Ook schijnt het dat het niet in oudere browsers ondersteund word. Weet iemand
hier iets van? Ter verduidelijking, ik heb het dus over de "width" in mijn layout.css.
Niet over de size in een html doc.

Greetz,

Deels.

Ik wil dat mijn platte HTML pagina een nette weergave is van de content. Dus mijn header is een H1, die ik rechtstreeks, zonder class, kan aanroepen in css. Het kopje van de pagina maak ik een H2, het menu een ul etc.

Maar je hebt wel gelijk wat betreft mijn div#footer en div#content.

size is idd geen css attribuut. Voor zover ik weet is dat ook nooit het geval geweest. Ondersteunt je browser geen css, dan doet size niks, en width niks. Ondersteunt je browser het wel, doet size nog steeds niks.

En ik bied geen ondersteuning voor browsers zonder css ondersteuning, maar mijn cleane html moet door blinden ook kunnen worden gesnapt. Zo vervang ik in de css de h1 door een background-image, en gooi met text-indent de inhoud van de h1 een pixel of 2000 naar links. best for both worlds?

[ Voor 0% gewijzigd door Jo3p789 op 12-08-2006 00:59 . Reden: puntje '.' moest hekje '#' zijn ]

[GateKeaper]

Zo kan je dan toch zonder "extra html" een input aanspreken. Dus dan hoef je geen
class mee te geven. Let wel op dat je hoofdletters gebruikt.

code:

INPUT { 
}

De width, die kent dus elke browser die css ondersteund? Zoals internet explorer 6, die kent
wel css, maar sommige dingen herkent hij toch ook weer niet. Is dit ook zo met width? Of
wordt dat wel volledig ondersteund door alle browsers?

[XWB]

Dat zei ik al maar dat wil hij niet, want dan worden ook radio buttons e.d. aangepast.

[GateKeaper]

Tjah, je kan met " INPUT, SELECT, TEXTAREA " al drie velden stylen. Een radio button gaat
moeilijker, maar als je daar vervolgens gewoon geen tekst aan mee geeft. En deze in een apparte
div erachter zet. Dan kan je de tekst in die div stylen. Dus een nette oplossing?

Mocht dat ook geen oplossing voor zijn, dan wordt het toch een class / id aan de velden meegeven.

[XWB]

Dat kan, maar een <label> lijkt me dan geschikter

[GateKeaper]

Heb je volkomen gelijk in. Mijn fout

Dan krijg je dus iets als onderstaand. Hoop dat de topicstarter er wat aan heeft,
het lijkt mij in ieder geval een mooie oplossing.

HTML:

<form name="input" action="">
   <input type="radio" name="geslacht" id="man" />
   <label for="man">Man</label>
   <br />
   <input type="radio" name="geslacht" id="vrouw" />
   <label for="vrouw">Vrouw</label>
</form>

Cascading Stylesheet:

INPUT {
/* Hier komt je styling */
}

label {
/* Hier komt je styling */
}

[Jo3p789]

Erg bedankt voor jullie reacties. Ik ben uiteindelijk voor class gegaan, dat lijkt me de meest eenvoudige oplossing.

Is een label trouwens meer dan alleen een span met extra argument 'for'?

[Verwijderd]

Ja. Een label heeft semantische waarde. Bovendien kunnen user agents het dan zo doen dat als als je op een label klikt, die klik wordt gepropageerd naar het element met het overeenkomstige id.

En ohja, HTML is case-insensitive, dus of je nou hoofdletters gebruikt of niet: het maakt geen fluit uit.

[ Voor 22% gewijzigd door Verwijderd op 12-08-2006 17:29 ]

[Fuzzillogic]

Overigens kun je wel met zaken als

Cascading Stylesheet:

input[type=text] { ...; }

werken in IE6, namelijk door even Dean Edwards IE7 script te includen.

En ohja, HTML is case-insensitive, dus of je nou hoofdletters gebruikt of niet: het maakt geen fluit uit.

XHTML is wel case sensitive

[Verwijderd]

Nexxennium schreef op zaterdag 12 augustus 2006 @ 18:53:

XHTML is wel case sensitive

En daar gebruik je sowieso dus geen hoofdletters

[duskarel]

Verwijderd schreef op zaterdag 12 augustus 2006 @ 18:57:
[...]
En daar gebruik je sowieso dus geen hoofdletters

Wel als je wat sympathiek code schrijft hé. Ik ga meestal (lees: altijd) voor de Java-naamgeving.

[Verwijderd]

OK, now you lost me.

[Rowanov]

duskarel schreef op zaterdag 12 augustus 2006 @ 19:31:
[...]
Wel als je wat sympathiek code schrijft hé. Ik ga meestal (lees: altijd) voor de Java-naamgeving.

Je bedoelt waarschijnlijk DezeNotering? Hoe wil je dat op html elementen (en attributen) gaan toepassen?

[crisp]

Nexxennium schreef op zaterdag 12 augustus 2006 @ 18:53:
[...]

XHTML is wel case sensitive

moet ik het nog een keer uitleggen?
XHTML(1.0) is de XML-serialisatie van HTML4.01; het voegt semantisch gezien niets toe, wijkt syntactisch gezien maar op een paar punten af en brengt praktisch gezien in 99 van de 100 gevallen meer nadelen dan voordelen met zich mee. De opvolgers van XHTML1.0 (1.1 en 2.0) zijn opgesteld door lieden die te ver van de werkelijkheid afstaan en hebben daardoor amper praktisch nut.

[Fuzzillogic]

Krijgen we dat weer. Noem ik één keer XHTML, nota bene in een volledig andere context, en gelijk weer een Crisp weer eroverheen met hoe geweldig SGML wel niet is. Waarom open je niet een nieuw topic, dan kunnen we het daar netjes uitvechten?

[crisp]

Nexxennium schreef op zondag 13 augustus 2006 @ 00:45:
Krijgen we dat weer. Noem ik één keer XHTML, nota bene in een volledig andere context, en gelijk weer een Crisp weer eroverheen met hoe geweldig SGML wel niet is. Waarom open je niet een nieuw topic, dan kunnen we het daar netjes uitvechten?

Als je dat aandurft hou ik je niet tegen