SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Member
    Join Date
    Jun 2006
    Posts
    5
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    aligning the fieldset...

    i have a little problem:

    i'd like to align all of the form elements to right and theirs labels to left.

    Everything is looking fine, till it goes to fieldset section - it doesn't align to right - it stays at the left side...

    below you can see the code

    Code:
    <span class="content">
    <p class="big">Dodawanie nowego produktu - Krok 1</p>
    <div id="form">
    <form action="page.html" method="post">
    <p><label for="dostawca">Dostawca:</label><select id="dostawca" name="dostawca"><option>...</option><option>Sandeman</option><option>TeaKettle</option><option>Seeds Of Australia</option></select></p>
    <p><label for="kod">Oznaczenie kodowe</label><input type="text" id="kod" name="kod"/></p>
    <p><label for="nazLat">Nazwa łacińska</label><input type="text" id="nazLat" name="nazLat"/></p>
    <p class="wasko"><label for="ilosc">Ilość</label><input type="text" id="ilosc" name="ilosc"/></p>
    <p class="wasko"><label for="jednMag">Jednostka magazynowa</label><select id="jednMag" name="jednMag"><option>...</option><option>10g</option><option>25g</option><option>5g</option></select></p>
    <p class="wasko"><label for="cena">Koszt Jednostki</label><input type="text" id="cena" name="cena"/></p>
    <p class="wasko"><label for="podatek">Podatek VAT</label><select id="podatek" name="podatek"><option>3%</option><option>7%</option><option>22%</option><option>0%</option></select></p>
    <p><label for="producent">Producent</label><select id="producent" name="producent"><option>...</option><option>Marolex</option><option>Polcan</option><option>Pokon</option></select></p>
    <p><label for="rodzina">Rodzina</label><select id="rodzina" name="rodzina"><option>...</option><option>Werbenowate</option><option>Rutowate</option><option>Sosnowate</option></select></p>
    <p><label for="realizacja">Termin Realizacji</label><input type="text" id="realizacja" name="realizacja"/></p>
    <p><fieldset><label for="polski">PL</label><input type="Checkbox" name="polski" id="polski"><label for="polski">PL</label><input type="Checkbox" name="polski" id="polski"><label for="polski">PL</label><input type="Checkbox" name="polski" id="polski"><label for="polski">PL</label><input type="Checkbox" name="polski" id="polski"></fieldset></p>
    </span></div>
    don't bother by Polish words... they are not important

    below is the css:
    Code:
    #form {
    position: relative;
    left: 100px;
    }
    .content {
    position: absolute;
    background-color: #5f9c4d;
    left: 140px;
    right:140px;
    top: 100px;
    }
    p.big {
    font-size: 2em;
    font-weight: bold;
    font-variant: small-caps;
    text-align: center;
    border: 1px solid black;
    }
    form p {
    width: 600px;
    clear: both;
    border-top: 1px dashed black;
    padding: 0px 100px 0px 50px;
    }
    form p label {
    float: left;
    font-style: italic;
    }
    form p input, form p select {
    float:right;
    width: 220px;
    background-color: #a2ca96;
    text-align: right;
    }
    form p.wasko input, form p.wasko select {
    width: 80px;
    }
    form fieldset {
    border: 0px;
    float: left;
    }
    here is the screen for this:


    What should i do?

    and one more question if i'd like to add a label to the fieldset - on the left side what should i do, adding label for the fieldset don't work...

    hopefully i'll find some help here

  2. #2
    SitePoint Member
    Join Date
    Jun 2006
    Posts
    18
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    so what exactly do u want 2 happen in the fieldset?

    ur entire fieldset is aligned to the left so all of its elements are to the left
    if u change the float of form fieldset to right, then it will all be at the right.
    then just add a label around it and it should work:

    Code:
    <label for="xxx"><fieldset>...</fieldset></label>
    and:
    Code:
    form fieldset {
    border: 0px;
    float: right;
    }


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •