2 forms op één regel

[.Alex]

Beste allemaal,

Hoe krijg ik twee formulieren op één regel?

HTML:

    <div id="merkkeuze" style="padding:5px;">
    Kies hier een merk: <form method="post" action="categorie.php"><select name="merk">
        <option value="">- Alle merken -</option>
    </select>
    <input type="submit" value="Verstuur"></form>
Bestel hier zon:<form method="post" action="piet.php"><select name="pieta">

            <option value="ja">ja</option>
            <option value="nee">nee</option>

            </select>
            <input type="submit" value="Bestel!"></form>
        
    </div>

Dit zegmaar... En nee, ik wil het niet oplossen met een tabel. Er moet een mooiere oplossing zijn.

[ Voor 25% gewijzigd door .Alex op 16-08-2007 13:30 ]

[mithras]

Waarom heb je uberhaupt twee forms. Je kan makkelijk met een form dit oplossen en twee selectboxes naast elkaar hebben staan

HTML:

<form>
  <select name="merk">
    <option value="">Alle merken</option>
    <option value="x">Merk x</option>
  </select>
  <select name="maat">
    <option value="">Alle maten</option>
    <option value="92-98">92-98</option>
  </select>
  <input type="submit" value="Filter">
</form>

Cascading Stylesheet:

select{
  float: left;
}

[ Voor 60% gewijzigd door mithras op 16-08-2007 13:16 ]

[We Are Borg]

float left bijv.

[.Alex]

Het formulier waar het om gaat ziet er anders uit. Heb dit gewoon snel in elkaar geknutseld om een idee te geven van wat ik wil.

Het gaat er dus niet om de werking van het formulier maar puur om de weergave...

[Cartman!]

Eens met mithras, 1 form gebruiken want de filters horen toch gewoon bij elkaar? Anders zou je niet eens op beide tegelijk kunnen filteren omdat maar 1 van de 2 forms gesubmit zal worden...

[StevenK]

iets met display:inline; in je stylesheet stoppen ?

[.Alex]

Cartman! schreef op donderdag 16 augustus 2007 @ 13:25:
Eens met mithras, 1 form gebruiken want de filters horen toch gewoon bij elkaar? Anders zou je niet eens op beide tegelijk kunnen filteren omdat maar 1 van de 2 forms gesubmit zal worden...

Ik heb de code maar aangepast want het schijnt toch onduidelijk te zijn...

Allen, zie edit!

StevenK schreef op donderdag 16 augustus 2007 @ 13:27:
iets met display:inline; in je stylesheet stoppen ?

Dat heeft er toch niets mee te maken?

[ Voor 20% gewijzigd door .Alex op 16-08-2007 13:31 ]

[mithras]

Een form is een block element, dus zal het zich als block gedragen

Door hem naar inline te schakelen zal het zich als inline gedragen (duh ) en er dus meerdere naast elkaar zetten

@hieronder: brrr, waarom een extra element rond een form zetten, en daarnaast is die tweede methode nog minder mooi...

[ Voor 19% gewijzigd door mithras op 16-08-2007 13:35 ]

[soulrider]

code:

<div class="form">
 <form>
....form1
</form>
</div>
<div class="form">
 <form>
.... form2
</form>
</div>

en dan

code:

#form{ 
  float: left; 
}
of 
div{
position: relative;
margin-top: 0px;
margin-left: 10px; //ofzo
}

maw geef ze een aparte div errond en positioneer die tegenover elkaar zoals je wilt...

(ofzoals hierboven vermeld ... damn wat ben ik traag )

[ Voor 7% gewijzigd door soulrider op 16-08-2007 13:35 ]

[Zoefff]

soulrider schreef op donderdag 16 augustus 2007 @ 13:34:

code:

<div class="form">
 <form>
....form1
</form>
</div>
<div class="form">
 <form>
.... form2
</form>
</div>

en dan

code:

#form{ 
  float: left; 
}
of 
div{
position: relative;
margin-top: 0px;
margin-left: 10px; //ofzo
}

maw geef ze een aparte div errond en positioneer die tegenover elkaar zoals je wilt...

(ofzoals hierboven vermeld ... damn wat ben ik traag )

Zo, dat is echt bijzonder onnuttige code. Een formelement is standaard gewoon een blokelement en daarmee _niets_ anders dan een div. Die twee div-wrappers zijn dus volledig overbodig, je kan de css net zo goed direct op de formelementen zetten

[.Alex]

mithras schreef op donderdag 16 augustus 2007 @ 13:34:
Een form is een block element, dus zal het zich als block gedragen

Door hem naar inline te schakelen zal het zich als inline gedragen (duh ) en er dus meerdere naast elkaar zetten

@hieronder: brrr, waarom een extra element rond een form zetten, en daarnaast is die tweede methode nog minder mooi...

Now we're talking! Thanks!

Met uitleg en al!

@Soulrider:
Een van de basisregels die ik gebruik is het vermijden van onnodige divs... en dat zouden meer mensen moeten doen

[mithras]

Zoefff schreef op donderdag 16 augustus 2007 @ 13:38:
[...]

Zo, dat is echt bijzonder onnuttige code. Een formelement is standaard gewoon een blokelement en daarmee _niets_ anders dan een div. Die twee div-wrappers zijn dus volledig overbodig, je kan de css net zo goed direct op de formelementen zetten

offtopic:
Moehaha, mijn edit was sneller

Sorry, moest er even uit

[soulrider]

auw, snelle reactie's op mijn reactie, maar allen terecht.

waarom div als je die form ook css'en , nu ik het herlees snap ik hem zelf niet

ach ja boven mijn vorige post stond toch al betere info dan in de mijne

(te ver gedacht, komt wrs omdat ik zonet goed nieuws heb gehad ivm job bij nieuwe werkgever, neen geen schrik, niet als webdesigner , zelfs niet meer in de IT)