div+% und px angaben

ad3nau

Hallo,
habe mal wieder ein kleines Problem. Ich habe einen umschließenden div mit 'width: 100%;' und ind diesen div habe ich noch andere div's. ICh habe alle div's in px angaben gemacht, bis auf eins, das möchte ich in % machen, so das sich es bis zum bildschirmrand erweitert.
Angenommen mein Bildschirm hat die Auflösung 800 * 600.
Mein erstens div ist 50px, mein zweites 80px und mein drittes 90px. Das sind insgesamt 220px, d.h. ich habe noch 580px übrig, und diese 580px sollen nun mit einen weiteren div ausgefüllt werden, der bis zum bildschirmrand geht, wie geht das?

Hoffe auf schnelle Antwort

Viele Grüße

yeti66

ad3nau,

also willst Du, um es auf den Punkt zu bringen ein 4SpaltenLayout mit 3 festen und einer flexiblen Spalte?
Dann mußt Du mit float: left/right arbeiten.

yeti66

ad3nau,

etwa so?

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Unbenanntes Dokument</title>
<style type="text/css">
<!--
#rahmen { width:800px; background-color:#333333 }
#spalte1 {width:50px; height:100px; float:left;background-color:#666666; }
#spalte2 {width:80px; height:120px; float:left;background-color: #999999; }
#spalte3 {width:90px; height:150px; float:left;background-color: #CCCCCC;  }
#hilfsrahmen { position: relative; top:0; right:0; }
#spalteflex { position: relative; top:0; right:0; margin-left:220px; height:180px;background-color: #99CC00; }
-->
</style>
</head>
<body>
<div id="rahmen">
  <div id="spalte1">Ich bin die 1.Spalte</div>
  <div id="spalte2">Ich bin die 2.Spalte</div>
  <div id="hilfsrahmen">
    <div id="spalte3">Ich bin die 3.Spalte</div>
    <div id="spalteflex">Ich bin die 4.Spalte</div>
  </div>
</div>
</body>
</html>

Alles anzeigen

P.S. Sinn macht es allerdings nur mit #rahmen { width:100%; background-color:#333333 }

ad3nau

Vielen Dank, es funktioniert

Viele Grüße

yeti66

ad3nau,

naja, ausgereift ist die Sache noch nicht. Im Prinzip kann der Hilfsrahmen wegfallen. Da hatte ich mich erst mit Prozentangaben rangemacht. Auch wenn längere Wörter ohne Space oder für Bilder mit größerer Breiteangabe als Container definiert wurde spielt der nochIE6 noch nicht mit. Es ist halt nur ein Ansatz.

ad3nau

Zitat von yeti66

ad3nau,

naja, ausgereift ist die Sache noch nicht. Im Prinzip kann der Hilfsrahmen wegfallen. Da hatte ich mich erst mit Prozentangaben rangemacht. Auch wenn längere Wörter ohne Space oder für Bilder mit größerer Breiteangabe als Container definiert wurde spielt der nochIE6 noch nicht mit. Es ist halt nur ein Ansatz.

Das hab ich schon gemerkt das es ab und zu zu kleinen Problemen führt, jedoch kann man die meist mit "Hilfsmitteln" ausbüglen.

Viele Grüße

div+% und px angaben

Tags

Benutzer online in diesem Thema