Dummies

Det bør være en måte å få skjemaet til å fungere riktig, uavhengig av beholderens bredde. CSSS3 gir nøyaktig en slik mekanisme som er lett å jobbe med når du designer HTML5-sidene dine.

Den klare attributtet brukes på elementer med en flyteattributt. Den klare attributtet kan settes til venstre, høyre eller begge deler. Hvis du angir den klare attributten til venstre, betyr det at du ikke vil ha noe til venstre for dette elementet. Med andre ord, elementet skal være på venstre side av beholderen. Hver etikett skal starte sin egen linje, så sett den klare attributten til venstre.

For å tvinge knappen til sin egen linje, angi dens klare attributt til begge. Dette betyr at knappen ikke skal ha noen elementer til venstre eller høyre. Det bør okkupere en linje helt egen.

Hvis du vil at et element skal starte en ny linje, må du angi både flyt og klare attributter til venstre. Hvis du vil at et element skal være på en linje alene, sett float til venstre og klar til begge.

Ved hjelp av det klare attributtet kan du ha en fleksibel breddebeholder og fortsatt opprettholde rimelig kontroll over formdesignen. Skjemaet kan ha samme bredde som siden og fortsatt fungere riktig. Denne versjonen fungerer, uansett bredden på siden.

Her er den endelige CSS-koden, inkludert klare attributter i etikettene og knappen:

/ * floatForm. css CSS-fil for å gå med float form Viser bruk av float, bredde, margin og tøm * / fieldset {background-color: #AAAFAF;} label {clear: left; flyte: venstre; bredde: 5em; tekstjustering: høyre; margin-høyre:. 5em;} input {float: left; bakgrunnsfarge: #CCCCFF;} -knappen {float: left; klare: begge; margin-venstre: 7em; margin-topp: 1em; bakgrunnsfarge: # 0000CC; farge: #FFFFFF;}