mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Fr 19.04.2024 09:26 Benutzername: Passwort: Auto-Login

Thema: [CSS] Horizontal füllendes Div gesucht | display:block vom 01.01.2011


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> [CSS] Horizontal füllendes Div gesucht | display:block
Autor Nachricht
DasBaum
Threadersteller

Dabei seit: 07.07.2009
Ort: -
Alter: -
Geschlecht: -
Verfasst Sa 01.01.2011 23:00
Titel

[CSS] Horizontal füllendes Div gesucht | display:block

Antworten mit Zitat Zum Seitenanfang

Ich habe einen Container mit fester Breite außen und möchte darin eine breitenfüllende Navigation anordnen.
Dazu habe ich 5 Links mit display:block mit float:left. Nun ist auf der rechten Seite dann noch Platz, den ich komplett füllen möchte. (Keine absoluten Pixelangaben)

Normalerweise sollte es ja funktionieren, wenn man beim rechten div das float weglässt, scheint es aber nicht, wie ihr euch hier überzeugen könnt: (Der Grüne div nimmt die komplette Breite des übergeordneten Containers an.)

http://www.herzog-stahlhandel.de/hilfe/

Wie bekomm ich dort einen Container hin, der immer den restlichen Platz einnimmt?

HTML
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-type" content="text/html; charset=UTF-8">
        <link rel="stylesheet" href="style.css">
    </head>
    <body>
       <div id="white">
            <div id="container">
    <!--HEAD-->
    <!--LOGO-->
    <!--NAVIGATION-->
                <div id="navigation">
                    <div class="button-p"><a href="index.html" title="Startseite">Startseite</a></div>
                    <div class="button-u"><a href="traditionsunternehmen.html" title="Traditionsunternehmen">Traditionsunternehmen</a></div>
                    <div class="button-u"><a href="produkte.html" title="Produkte">Produkte</a></div>
                    <div class="button-u"><a href="dienstleistungen.html" title="Dienstleistungen">Dienstleistungen</a></div>
                    <div class="button-u"><a href="kontakt.html" title="Kontakt">Kontakt</a></div>
                    <div id="search">
                    </div>
                    <div class="clear"></div>
                </div>
            </div>
        </div>
    </body>
</html>


CSS
Code:
*{margin:0; padding:0; border:0; font-family:Arial; line-height:17px;}

a:link {color:#1a4092; text-decoration:none;}
   a:visited {color:#1a4092; text-decoration:none;}
   a:active {color:#1a4092; text-decoration:none;}
   a:hover {color:#1f4cac; text-decoration:underline;}

body{width:100%; background-color:#eeeeee;}   
   #white{width:100%; background-color:#ffffff; padding:30px 0 30px 0;}
      #container{width:968px; margin:0 auto 0 auto;}
         #navigation{font-size:12px; font-weight:bold;}
            .button-p a{margin:0 1px 0 0; text-decoration:none; padding:6px 30px 6px 30px; display:block; background-color:#1a4092; color:#eeeeee; float:left; border-left:1px solid #15347b; border-right:1px solid #15347b; border-top:1px solid #15347b;}
            .button-u a{margin:0 1px 0 0; text-decoration:none; padding:6px 30px 5px 30px; display:block; background-color:#eeeeee; color:#474747; float:left; border:1px solid #cfcfcf;}
               .button-u a:hover{background-color:#e3e3e3;}
            #search{background-color:#452; height:20px;}
.clear{clear:both;}
  View user's profile Private Nachricht senden
buchstabensuppe

Dabei seit: 14.09.2004
Ort: Wuppertal
Alter: 40
Geschlecht: Männlich
Verfasst So 02.01.2011 00:41
Titel

Antworten mit Zitat Zum Seitenanfang

Ich wüsste nicht, wie das klappen sollte. Bei einer Tabelle mit einer Breite von 100% klappt das, keine Frage.
Wofür soll das DIV denn da sein? Auch ein Navigationspunkt?
  View user's profile Private Nachricht senden
Anzeige
Anzeige
DasBaum
Threadersteller

Dabei seit: 07.07.2009
Ort: -
Alter: -
Geschlecht: -
Verfasst So 02.01.2011 00:51
Titel

Antworten mit Zitat Zum Seitenanfang

Soll ein Suchfeld werden.

Wenn ich aus den display:blocks einzelne divs mache, dann müsste das ganze doch klappen, oder hab ich einen denkfehler?

Aber das es so nicht geht? Meine Güte!
  View user's profile Private Nachricht senden
DasBaum
Threadersteller

Dabei seit: 07.07.2009
Ort: -
Alter: -
Geschlecht: -
Verfasst So 02.01.2011 02:11
Titel

Antworten mit Zitat Zum Seitenanfang

Um die Frage mal völlig zu vereinfachen.

Ich habe außen ein Div ("Container") mit fester Breite. Darin befindet sich links ein Div mit variabler Breite (Textabhängig) und rechts daneben möchte ich ein div haben, das den restlichen Container füllt.

Geht das überhaupt, mir erscheint die Frage so simpel, aber eine Umsetzung fehlt mir vollkommen... * Nee, nee, nee *
  View user's profile Private Nachricht senden
geviert

Dabei seit: 06.05.2010
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst So 02.01.2011 04:24
Titel

Antworten mit Zitat Zum Seitenanfang

Ich denke auch dass dies nicht möglich ist. Allerdings nur unter Vorbehalt, ich verwerte gerade meine Restalkohole (fortgeschritten) und bin dementsprechend in meiner Denkweise leicht eingeschränkt.
  View user's profile Private Nachricht senden
buchstabensuppe

Dabei seit: 14.09.2004
Ort: Wuppertal
Alter: 40
Geschlecht: Männlich
Verfasst So 02.01.2011 10:32
Titel

Antworten mit Zitat Zum Seitenanfang

Nein, meiner Meinung nach funktioniert das leider nicht.

In deinem Falle müsstest du auf eine Tabelle umsteigen. Diese auf 100% stellen, die ersten Zellen mit fester Breite versehen und die letzte passt sich automatisch an. In dieser dann das Suchfeld, welches sich ebenfalls an die volle, verfügbare Breite anpasst.

Sollte es allerdings doch klappen bin ich auf die Lösung gespannt. Lächel
  View user's profile Private Nachricht senden
 
Ähnliche Themen divs - display: block und none
[CSS] display: block; bei div`s die in % angaben sind?
css display bei horizontal
CSS: Problem mit Opera und display:inline-block
De-Block Photoshop-Filter für CS4 gesucht
Gesucht: Info-Stellwand/Display-System
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.