[Hilfe] CSS Elemente fixieren

  • Heyho Towner,

    Ich arbeite derzeit ein wenig mit CSS und HTML und habe nun folgendes Problem.
    Ich hab alles mögliche versucht, jedoch sind die Objekte bei anderen immer ganz
    wo anders positioniert. Gibt es einen weg, die Objekte fix zu positionieren, dass
    sie sich selbst wenn man einen kleineren Bildschirm hat an den Browser anpasst?

    Hier mein Code:

    Spoiler anzeigen


    @import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro);
    @import url(http://fonts.googleapis.com/css?family=Open+Sans);

    body {
    background-image: url(/data/images/index/bg.png);
    }

    h1 {
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 500;
    }

    h2 {
    font-family: 'Open Sans', sans-serif;
    font-weight: 300;
    color: #fff;
    }

    #logo {
    background-image: url(/data/images/soon/logo.gif);
    height: 40px;
    width: 110px;
    position: absolute;
    top: 7%;
    left: 24%;
    }

    #boxlogin {
    background-color: rgba(0,0,0,0.7);
    position: absolute;
    height: 40px;
    width: 650px;
    top: 18%;
    left: 23%;
    border-radius: 4px;
    padding-top:15px;
    padding-left:250px;
    }

    #boxuseronline {
    background-color: rgba(0,0,0,0.7);
    position: absolute;
    height: 70px;
    width: 225px;
    top: 5%;
    left: 64%;
    border-radius: 4px;
    padding-left: 10px;}


    Danke im Voraus!

    • Offizieller Beitrag

    Ich hoffe ich habe es richtig verstanden. :)
    Ich würde zuerst mal so machen:
    .main {
    margin-left: auto;
    margin-right: auto
    width: 840px;
    }

    Das dient dazu schonmal alles in der Mitte zu haben, es wird bei jedem Bildschirm angepasst. Da packst du jetzt halt z.B. das Logo hinein oder die boxlogin. Du weiß sicherlich wie ich das meine. ;)

    #SendWithSamsungGalaxyS4

    ,,Besser es fehlt eine Spalte in der Datenbank als im echten Leben"

    - manatee, 03.12.2016

    Gebl8Se.png

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!