[CSS] login div positionierung

Dieses Thema im Forum "Webdesign" wurde erstellt von .x-tra, 13. Februar 2009 .

Schlagworte:
  1. 13. Februar 2009
    login div positionierung

    also ich hab nen div mit breite 220 und höhe 100.
    dieses login soll da rein, also ich hab die zwei felder und den text und button usw. auch.
    aber ich weiß nicht wie man das genau so positionieren würde.

    kann mir da jemand sagen wie das geht?
    soooo solls aussehen--> {bild-down: http://pict.cc/pics/e/9/f/0ce0cc4457963d442916623b73aa92d7.jpg}
     
  2. 13. Februar 2009
    AW: login div positionierung

    Hey,

    ich löse das immer mit Tabellen:

    Code:
    <div id="deindiv">
    <table>
     <tr>
     <td><b>Benutzername</b></td>
     <td><input type="text"></td>
     </tr>
     <tr>
     <td><b>Passwort</b></td>
     <td><input type="text"></td>
     </tr>
     <tr>
     <td><input type="submit" value="Login"></td>
     <td><input type="checkbox"></td>
     </tr>
    </table>
    </div>
    

    Gruß Blackbird89
     
  3. 13. Februar 2009
    AW: login div positionierung

    aha ich hätte das gern aber ohne tabellen.reines css halt.
     
  4. 14. Februar 2009
    AW: login div positionierung

    Gib dem Außenelement ein position:relative, dann kannst du es einfach position:absolute positionieren.
    Ansonsten halt mit float left und right und margin/padding
     
  5. 14. Februar 2009
    AW: login div positionierung

    du meinst dann bei allen divs dann jeweils ein position:absolute einfügen?
    mit dem ganzen gefloate tu ich mich nämlich immer schwer.
    ich würds schon gern floaten aber hab da wohl keinen so richtigen schimmer.
     
  6. 14. Februar 2009
    AW: login div positionierung

    Dann ist es wohl am einfachsten, wenn du wie gesagt, dem gesamten Element ein position:relative gibst und dann alle Unterelemente wie die input-boxen mit position:absolute positionierst. (Die Positionsangaben beziehen sich dann auf die linke obere Ecke des äußeren divs)
     
  7. 17. Februar 2009
    AW: login div positionierung

    Code:
    <div class="login">
     <label for="nickname">Benutzername</label><input type="text" name="nickname" id="nickname" value=""/>
     <label for="password">Passwort</label><input type="password" name="password" id="password" value=""/>
     <input type="submit" value="Login"/><input type="checkbox" name="autologin"/>Autologin
    </div>
    Dann mit CSS die Breiten und Höhen angeben, da dein Div eine feste Breite hat, brauchst du nicht unbedingt <br/> zu verwenden, wenn Label + Input genug Platz einnehmen.
     
  8. Video Script

    Videos zum Themenbereich

    * gefundene Videos auf YouTube, anhand der Überschrift.