zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Div Wight Auto????

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 21.06.2009, 20:31
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 07.10.2007
Beiträge: 6
temp11 befindet sich auf einem aufstrebenden Ast
Ausrufezeichen Div Wight Auto????

Div Wight Auto????

Beitragvon temp11 » 20.06.2009, 10:41
Hallo Leute,

Ich habe ein insgesammt 3 Divs und eine Liste.

Div 1 ist der Div in dem sich Div 2 und Div 3 befinden er hat eine feste Größe 500px.

Div 2 und Div 3 sollen nebeneinander (also float:left) in Div 1 erscheinen.

Die größe von Div 2 wird durch die Größe der Liste UL in Div 2 bestimmt.

Die größe von Div 3 soll den noch freien Platz zwischen Div 2 und dem Rechten Rand von

Div 1 ausfüllen.

Zur Veranschaulichung gibts eine Skizze.


Meine Frage Wie zum Geier mach ich das????

Ich will keine Tabelle nutzen um das Problem zu lösen!
Angehängte Grafiken
Dateityp: jpg div.jpg (22,7 KB, 15x aufgerufen)
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 23.06.2009, 16:03
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 11.03.2009
Beiträge: 104
Lexodus befindet sich auf einem aufstrebenden Ast
Standard

So wirds gemacht;

Wichtig ist nur das der dritte Div kein float bekommt, dann Stretcht er --> ist zwar komisch, is aber so.

HTML-Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html style="height:100%;width:100%">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Beispiel</title>
<style type="text/css">
div
{
border-style:solid;
border-width:1;
margin:0px;
padding:0px;
}
#eins
{
Width:500px;
background-color:black;
}
#zwei
{
Height:100px;
background-color:green;
float:left;
}
#drei
{
background-color:red;
Height:100px;

}

</style>
</head>
<body>


<div id="eins">

<div id="zwei">Ziemlich Breiter Inhalt.</div> <div id="drei">Inhalt</div>

</div>


</body>
</html>  
Gruss
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 23.06.2009, 16:17
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 14.03.2007
Ort: Bad Schmiedeberg
Beiträge: 1.397
regloh wird schon bald berühmt werden
Standard

Zitat:
ist zwar komisch, is aber so.
Wieso ist das komisch? Ist doch nachvollziehbar. Wenn der Container ohne float und width vor den floats stehen würde, nähme er die gesamte Breite ein (mit begrenzter Breite würde er zumindest noch einen Umbruch erzeugen) und die floats rutschen runter. Logisch.

Geändert von regloh (23.06.2009 um 16:46 Uhr)
Mit Zitat antworten
  #4 (permalink)  
Alt 23.06.2009, 16:55
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 11.03.2009
Beiträge: 104
Lexodus befindet sich auf einem aufstrebenden Ast
Standard

Es ist in der Hinsicht komisch, dass es im Technischen Sinne die Bedeutung von Float überlädt;

Das Standard-Verhalten eines Div's ist, die gesamte Breite unabhängig vom Inhalt einzunehmen.

Wenn du nun Float setzt drehst du dieses Standard verhalten und es gibt soweit ich weiss keine Möglichkeit mit zusätzlichen CSS/HTML Elementen einem Floatenden Div zu sagen das es trotzdem die Breite einnehmen soll.

Obwohl aus der Sicht eines Anwenders durchaus Sinn machen kann, dieses Verhalten bei einem floatenden Div zu beinflussen.

Also;
A: Div mit Float wachsend
B: Div mit Float nicht wachsend

Ich seh durchaus beide Anwendungszwecke, Faktisch kannst du es aber nicht mit CSS, sondern du musst das Float wegnehmen.

--> Überladung
Mit Zitat antworten
  #5 (permalink)  
Alt 23.06.2009, 17:06
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 14.03.2007
Ort: Bad Schmiedeberg
Beiträge: 1.397
regloh wird schon bald berühmt werden
Standard

Zitat:
Wenn du nun Float setzt drehst du dieses Standard verhalten und es gibt soweit ich weiss keine Möglichkeit mit zusätzlichen CSS/HTML Elementen einem Floatenden Div zu sagen das es trotzdem die Breite einnehmen soll
Warum sollte ein Float auch die gesamte Breite einnehmen, wenn ein Element ohne float dies bereits tut? Wozu sollte es dann float geben, wenn daneben garkeinen Platz für umfließenden Text gibt, wenn floats die gesamte Breite einnehmen würden? Float heißt ja "umfließen" und dies setzt vorraus, dass das floatende Element eine geringere Breite hat, als das umgebende Element, damit auch etwas umfließen kann.
Mit Zitat antworten
  #6 (permalink)  
Alt 23.06.2009, 17:35
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 11.03.2009
Beiträge: 104
Lexodus befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von regloh Beitrag anzeigen
Warum sollte ein Float auch die gesamte Breite einnehmen, wenn ein Element ohne float dies bereits tut?
Hmm ich versteh die Frage nicht, weil du aus was für Gründen auch immer willst dass das div floated?

Ist ja meistens so das jemand Fragt, "wie bekomm ich es gebacken dass ein DIV neben dem andern DIV liegt und nicht unter dem andere"

Dann wird (auch in diesem Forum) teilweise Empfohlen Float zu verwenden, und da denke ich ist es eine legitime Anforderung bis nach "rechts" aufzufüllen oder eben nicht. --> Wenn du wie du sagst kein Float verwendest müsste das DIV ja unter dem Div dargestellt werden.

Die andere Möglichkeit das div "Rechts" darzustellen ist glaube ich dann margin-left:0 auto. (Was ich um sowas wie zentrierung/auffülen abzubilden genau so schlecht finde)

Geändert von Lexodus (23.06.2009 um 17:37 Uhr)
Mit Zitat antworten
  #7 (permalink)  
Alt 23.06.2009, 17:44
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 11.03.2009
Beiträge: 104
Lexodus befindet sich auf einem aufstrebenden Ast
Standard

@Regloh
Genau dieses Beispiel;

(2 Divs, der "erste" floatet, damit der Zweite rechts neben diesem Div ist). Hier erreichst du eben genau dieses Auffüllen oder nicht nur mit Float und das empfinde ich als überladung.

HTML-Code:
#eins
{
Height:100px;
Width:100px;
background-color:green;
float:left;
}
#zwei
{
Height:100px;
background-color:blue;
}

<div id="eins"></div>
<div id="zwei"></div>
@Edit
Ich muss jetzt leider weg, deine Meinung würde mich aber doch noch interessieren.

Geändert von Lexodus (23.06.2009 um 17:50 Uhr)
Mit Zitat antworten
  #8 (permalink)  
Alt 23.06.2009, 17:56
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 14.03.2007
Ort: Bad Schmiedeberg
Beiträge: 1.397
regloh wird schon bald berühmt werden
Standard

Zitat:
Hier erreichst du eben genau dieses Auffüllen oder nicht nur mit Float und das empfinde ich als überladung.
Sorry, aber den Satz verstehe ich nicht.

Klar muss das floatende Element zuerst kommen. Wenn #zwei als erstes im Markup stehen würde, würde es ja die komplette Breite einnehmen und #eins hätte dann keinen Platz mehr und rutscht unter #zwei.
Mit Zitat antworten
  #9 (permalink)  
Alt 30.06.2009, 13:34
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 07.10.2007
Beiträge: 6
temp11 befindet sich auf einem aufstrebenden Ast
Standard

Vielen Dank für die vielen Antworten.

hätte nicht gedacht das so so einfach ist

Vielen Dank
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Fragen zu CSS und Joomla DOKTOR CSS 2 23.05.2011 20:29
Brauche Hilfe: Schwarzes Nichts Zwox CSS 10 19.11.2010 17:53
Header entfernen tripple CSS 17 15.06.2010 16:41
Schriftfarbe in den Eintragungsfeldern von jforms Steveislucky CSS 2 16.03.2010 11:59
rätselhafter Leerraum zwischen Content und Footer im IE jhonnybravo CSS 5 04.03.2010 12:47


Alle Zeitangaben in WEZ +2. Es ist jetzt 09:47 Uhr.