1. Dashboard
  2. Artikel
  3. Mitglieder
    1. Letzte Aktivitäten
    2. Benutzer online
    3. Team
    4. Mitgliedersuche
  4. Forum
    1. Unerledigte Themen
  • Anmelden
  • Registrieren
  • Suche
Dieses Thema
  • Alles
  • Dieses Thema
  • Dieses Forum
  • Artikel
  • Seiten
  • Forum
  • Erweiterte Suche
  1. HTML - Webmaster Forum
  2. HTML / Webmaster Forum
  3. HTML & CSS Forum

Position Problem

  • Billbos
  • 13. August 2010 um 08:46
  • Billbos
    Profi
    Beiträge
    485
    • 13. August 2010 um 08:46
    • #1

    Hallo Leute,

    ich habe eine Bottomnavigation diese soll unten rechts positionier sein. Habe es mit position: relative und absolute versucht, aber komme dabei nicht zu dem richtigen Ergebnis.

    So soll es ausschauen:

    [Blockierte Grafik: http://billbos.eu/forumbilder/position.png]

    und so schaut es aus,

    http://billbos.eu/final/home.php

    PS: Habe den roten Hintergrund genommen, zur besseren Erkennung!

    MFG Billbos :lol:

    http://www.danielsfotos.com

  • threadi
    König(in)
    Reaktionen
    4
    Beiträge
    1.391
    • 13. August 2010 um 09:08
    • #2

    Wenn Du .bottomnav eine größere Breite gibst, dann passen die Menüpunkte auch auf eine Zeile.

  • Billbos
    Profi
    Beiträge
    485
    • 13. August 2010 um 09:12
    • #3

    das möchte ich ja nicht, mir kommt es auf die positionierung an

    http://www.danielsfotos.com

  • sejuma
    Kaiser(in)
    Reaktionen
    5
    Beiträge
    2.720
    • 13. August 2010 um 10:14
    • #4

    Das sollte helfen:
    Footer immer unten anordnen

    [Blockierte Grafik: http://www.ohne-css.gehts-gar.net/img/banner/banner350x20.png]
    sejuma's CSS-Einsteigerkurs

  • Billbos
    Profi
    Beiträge
    485
    • 13. August 2010 um 15:44
    • #5

    Somit liegt mir der Footer aber nicht da, wo ich ihn haben möchte, er soll ja nur 150px einnehmen und auf der rechten Seite sein, oder meinst du ich sollte ich auch auf 600px machen?

    http://www.danielsfotos.com

  • sejuma
    Kaiser(in)
    Reaktionen
    5
    Beiträge
    2.720
    • 13. August 2010 um 16:26
    • #6

    Ja, mach den Footer über die gesamte Breite und positioniere darein deine Navi mit float: right;

    [Blockierte Grafik: http://www.ohne-css.gehts-gar.net/img/banner/banner350x20.png]
    sejuma's CSS-Einsteigerkurs

  • Billbos
    Profi
    Beiträge
    485
    • 15. August 2010 um 21:15
    • #7

    Okay, also irgendwas stimmt noch nicht?

    http://www.danielsfotos.com

  • sejuma
    Kaiser(in)
    Reaktionen
    5
    Beiträge
    2.720
    • 15. August 2010 um 21:28
    • #8

    Lass das rote hier weg:

    Zitat


    .bottomnav {
    float: right;
    width: 150px;
    height: 20px;
    background-color: #F00;
    font-size: 10px;
    position: absolute;
    bottom: 0;

    }

    Alles anzeigen

    [Blockierte Grafik: http://www.ohne-css.gehts-gar.net/img/banner/banner350x20.png]
    sejuma's CSS-Einsteigerkurs

  • Billbos
    Profi
    Beiträge
    485
    • 15. August 2010 um 21:51
    • #9

    hmm schon besser aber trotzdem noch nicht anliegend an dem wrapper!

    http://www.danielsfotos.com

  • sejuma
    Kaiser(in)
    Reaktionen
    5
    Beiträge
    2.720
    • 16. August 2010 um 07:14
    • #10

    Dann lies dir das Tutorial nochmal durch. Du brauchst einen allumfassenden wrapper, der alles andere einschließt.

    [Blockierte Grafik: http://www.ohne-css.gehts-gar.net/img/banner/banner350x20.png]
    sejuma's CSS-Einsteigerkurs

  • Billbos
    Profi
    Beiträge
    485
    • 16. August 2010 um 13:01
    • #11

    Das Ding ist jetzt aber, dass wenn ich die Navigation in den Wrapper einschließe befindet sich diese ja in meinem Contentfeld das möchte ich auch nicht, hast du einen Code?

    http://www.danielsfotos.com

  • sejuma
    Kaiser(in)
    Reaktionen
    5
    Beiträge
    2.720
    • 16. August 2010 um 13:49
    • #12

    Lass bei deiner jetzigen Version mal bei #wrapper die 100% height weg
    und nimm bei #footer einen bottom-Wert von -20px.

    [Blockierte Grafik: http://www.ohne-css.gehts-gar.net/img/banner/banner350x20.png]
    sejuma's CSS-Einsteigerkurs

  • Billbos
    Profi
    Beiträge
    485
    • 16. August 2010 um 13:58
    • #13

    Schau mal habe ein Update gemacht aber das Problem ist nach wie vor da, siehe Profile!

    http://www.danielsfotos.com

  • sejuma
    Kaiser(in)
    Reaktionen
    5
    Beiträge
    2.720
    • 16. August 2010 um 14:12
    • #14

    Im Gegensatz zu "Home" (dort scheint es mir so dargestellt wie du es gerne hättest) fehlt bei "Profile" der Footer-Div.

    [Blockierte Grafik: http://www.ohne-css.gehts-gar.net/img/banner/banner350x20.png]
    sejuma's CSS-Einsteigerkurs

  • Billbos
    Profi
    Beiträge
    485
    • 16. August 2010 um 14:28
    • #15

    Gerettet vielen Dank hat geklappt!

    http://www.danielsfotos.com

Tags

  • www
  • color
  • http
  • hintergrund
  • update
  • problem
  • navigation
  • version
  • code
  • php
  • navi
  • bot
  • bottom
  • div
  • position
  • png
  • height
  • absolute
  • css
  • tutorial
  • avi
  • footer
  • float
  • wrapper
  1. Datenschutzerklärung
  2. Impressum
Community-Software: WoltLab Suite™