Größe Proportial ändern
Mr. Unknown
- html
Hallo!
Ich bin im Bereich Html noch ein ziemlicher Anfänger.
Wenn man das Fenster des Browsers maximiert ist das iframe neben dem Menü. Wenn man das Fenster schmäler macht springt es irgendwann unter das Menü. Das möchte ich verhindern! Bloß wie? Es liegt ja wahrscheinlich daran, dass sich die Prozentangabe der Größe des iframes an dem Haupfenster orientiert.
Seeeeeeeeehr gekürzter Code meiner Homepage:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<style type="text/css">
#sidebar{float: left;width: 250px;}
#home{margin: auto;}
</style>
<html>
<body>
<div id="sidebar">
<ul>
<li><strong>Home</strong></li>
<li>...
</ul>
</div>
<div id="home">
<iframe name="mainframe" scr="Home/index.php" width="70%" height="100%">
</div>
</body>
</html>
Hoffe ihr könnt mir helfen
Hi,
Wenn man das Fenster des Browsers maximiert ist das iframe neben dem Menü. Wenn man das Fenster schmäler macht springt es irgendwann unter das Menü.
Das ist eine der grundlegenden Eigenschaften gefloateter Elemente. Wenn sie nicht "neben" andere passen, dann werden sie halt darunter dargestellt.
Es liegt ja wahrscheinlich daran, dass sich die Prozentangabe der Größe des iframes an dem Haupfenster orientiert.
Es liegt wohl eher daran, dass du die Breite des einen Elements in Prozent, die des anderen aber fest in Pixeln angegeben hast.
#sidebar{float: left;width: 250px;}
<iframe name="mainframe" scr="Home/index.php" width="70%" height="100%">
So lange das Fenster gross genug ist, sind 250px halt kleiner als 30% - irgendwann aber nicht mehr.
MfG ChrisB
Hallo Mr. Unknown.
Du wirst hier im Forum zwar ständig darüber informiert, daß Tabellen out sind und alles mit Divs machbar ist, aber auf eine Container-Lösung für so eine kleine, lächerliche Spielerei wirst du ewig vergeblich warten:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<style type="text/css">
body { margin: 0px 0px 0px 0px;}
#tab { width:100%; height:100%; border: 0px solid #000000; }
#menu {width:200px; background: #00ff00;}
#inline { width:100%; height:100%;}
</style>
<body>
<table cellspacing="0" id="tab"><tr>
<td id="menu" valign="top"> </td>
<td><iframe id="inline" src="http://www.google.de" frameborder="0">
</iframe></td></tr></table>
</body></html>
Gruß Class Clever
Danke, Divkiller. Hast mir sehr geholfen. Jetzt kann ich endlich wieder ruhig schlafen.