formularze a zgodność ze standardami

[swinia]

Witam, mam takie pytanie, w jaki sposób należy napisać formularz żeby w widoku strony elementy były pod sobą, tak jak w kodzie ?? Bo chyba takich rzeczy nie rozwiązuje się poprzez użycie <br>.

Kod:

        <label>Imię i Nazwisko</label>
        <input id="imienazwisko" name="imie" />
        <label>E-mail</label>
        <input id="email" name="email" />
        <label>Treść</label>
        <textarea cols="20" rows="10" id="tresc1" name="tresc"></textarea>

[Ancik]

Witaj,

Oczywiście, że nie przez <br>. Zależy od przypadku, ale ja bym szukał rozwiązania w clear: both;

Pozdrawiam.

[Rafik01]

Po pierwsze to należy stosować elementy formularza w znacznikach blokowych ( np. "p" bądź "div" ). Przykład:

Kod:

<p><input type="button" value="Pamiętaj webmasterze młody, chowaj formularze do znaczników blokowych!" /></p>

Powinno wystarczyć.

[Pedro84]

Po pierwsze to należy stosować elementy formularza w znacznikach blokowych ( np. "p" bądź "div" ). Przykład:
Powinno wystarczyć.

Bzdury pleciesz. Najpoprawniejszym rozwiązaniem wydaje się stosowanie list (Paragrafy? To że wielu tak robi nie znaczy, że jest to poprawne - to już bardziej divy).

Tak jak Ci napisał @Ancik.

[Kartofelek]

I tak i nie. W sumie nie ma 100% ustalonych norm do tego.
Osobiście stosuję div i bardzo dobrze się z tym czuję. Niektórzy stosują br i też dobrze się z tym czują. A niektórzy stosują listy definicji, ale jak powiedziałem - nie jest to wyznacznikiem.
Żadne clear both. Chodzi o to, że jak ktoś nie będzie miał stylowania, wtedy dostanie złączoną kupę.

[Ancik]

To, że ktoś dobrze czuje się z <br> raczej mnie nie przekonuje. Tak samo jak ktoś budujący strony na tabelach i dobrze się z tym czujący. O ile dobrze pamiętam, sam już wspominałeś do czego służy br. Czy listy czy divy z kolei to faktycznie nie ma znaczenia.

W momencie, kiedy ujmiesz pola formularza w bloki, to bez stylowania i tak możesz dostac 'złączoną kupę'.

[Marcin]

Musisz każdą parę tj label i input czy inny element formularza zamknąć w jakiś wrapper. Może to być wspomniany div, li czy p.

Przykładowo:

Kod:

<form id="jakiesid">
<div>
   <label>Imię i Nazwisko</label>
   <input id="imienazwisko" name="imie" />
</div>
....

Następnie dla tego konkretnego przypadku napisać kawałek kodu CSS na przykład coś takiego

Kod:

#jakiesid div label {
width: 100%;
display: block;
}
#jakiesid div input {
display: block;
}

Powinno zadziałać, jeśli nie to dorzuć jeszcze float: left dla tych elementów bo nie wiem jak pozycjonujesz generalnie elementy w Twoim projekcie.

[Kartofelek]

Niektórzy dobrze czują się stosując h1-h3, a niektórzy korzystają i z h4 i h5. Gramatyka jest po to by ją poprawnie stosować, ale nie narzuca ci stylu pisania.
Tak samo jak z np nazwami zmiennych. Możesz używać "camel kejsa" a możesz sobie robić podkreślenia między słowami.
Wszystko to są warianty, więc wybierz sobie ten najwłaściwszy.

Ogólna zasada jest taka, że w formie musisz mieć "otoczke", czyli np input nie może być bezporednio w formie. Reszta to twoje widzimisie. Osobiście np stosuję taką konstrukcję:
<form>
<fieldset>

<div class="ln">
<label for="...">....</label><div class="content">......<inputy>.....</div>
</div>

</fieldset>
</form>

W Admin generatorze też stosują taką. Czemu? Bo jest ona dość bezpieczna, chociaż można oczywiście prościej