Auf Thema antworten 2026

Beitrag

<blockquote data-quote="JPS" data-source="post: 1708615" data-attributes="member: 293118">AW: [CSS] position absolute unter position relaitveHier die Seite[HTML]&lt;!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Transitional//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&quot;&gt;&lt;html xmlns=&quot;http://www.w3.org/1999/xhtml&quot;&gt;&lt;head&gt;&lt;meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html; charset=utf-8&quot; /&gt;&lt;title&gt;&lt;/title&gt;&lt;link href=&quot;style.css&quot; media=&quot;all&quot; rel=&quot;stylesheet&quot; type=&quot;text/css&quot; /&gt;&lt;!--[if !IE 7]&gt;&nbsp; &lt;style type=&quot;text/css&quot;&gt;&nbsp;&nbsp; #wrap {height:100%;display:table}&nbsp; &lt;/style&gt;&nbsp;&lt;![endif]--&gt;&lt;/head&gt;&lt;body&gt;&lt;div id=&quot;hdback&quot;&gt;&lt;table width=&quot;100%&quot; cellpadding=&quot;0&quot; cellspacing=&quot;0&quot;&gt;&nbsp; &lt;tr&gt;&nbsp; &lt;td background=&quot;images/bg_l_o.jpg&quot; width=&quot;50%&quot;&gt;&lt;img src=&quot;images/spacer.gif&quot; width=&quot;1&quot; height=&quot;265&quot; /&gt;&lt;/td&gt;&nbsp; &lt;td background=&quot;images/bg_r_0.jpg&quot; width=&quot;50%&quot;&gt;&lt;img src=&quot;images/spacer.gif&quot; width=&quot;1&quot; height=&quot;265&quot; /&gt;&lt;/td&gt;&nbsp; &lt;/tr&gt;&lt;/table&gt;&lt;/div&gt;&nbsp;&lt;div id=&quot;wrap&quot;&gt; &lt;div id=&quot;content&quot;&gt;&nbsp;&lt;div id=&quot;home&quot;&gt;&lt;div id=&quot;logoframe&quot;&gt;&lt;div id=&quot;logo&quot;&gt;&lt;img src=&quot;images/header_1.jpg&quot; width=&quot;980&quot; height=&quot;265&quot; /&gt;&lt;/div&gt;&lt;/div&gt;&nbsp; &nbsp; &lt;/div&gt;&nbsp;&lt;/div&gt;&lt;/div&gt;&lt;div id=&quot;footer&quot;&gt;&lt;div id=&quot;footframe&quot;&gt;&lt;div id=&quot;foot&quot;&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/body&gt;&lt;/html&gt;[/HTML]&nbsp;Hier das CSS[CODE]@charset &quot;utf-8&quot;;/* CSS Document */* {margin:0;padding:0;}html, body {height: 100%;}#hdback {position:absolute; top:0; left:0; z-index:1; width:100%; height:265px;}#wrap {min-height: 100%;z-index:2;}#main, #home {&nbsp;overflow:auto;&nbsp;padding-bottom: 61px;} #footer {position: relative;&nbsp;margin-top: -61px;&nbsp;height: 60px;&nbsp;clear:both;} /*Opera Fix*/body:before {/* thanks to Maleika (Kohoutec)*/content:&quot;&quot;;height:100%;float:left;width:0;margin-top:-32767px;/* thank you Erik J - negate effect of float*/}#foot {height: 60px;&nbsp;background-image:url(../images/foot_bg.jpg);&nbsp;background-repeat: no-repeat;}#footframe {background-color:#c88c4c; height:60px;}#logoframe {background-color:#c88c4c; height:265px;}#logo {width:980px; margin:0 auto;} #content {width:980px; margin:0 auto;}#foot{width:980px; margin:0 auto;}#content {&nbsp;background-image:url(../images/bg_main.jpg);&nbsp;background-repeat: repeat-y;&nbsp;min-height: 100%;}[/CODE]&nbsp;Also das eigentlich Problem ist auch dieses DIV mit dem TABLE. Es soll halt rechts und links vom HEADER BILD (zentriert) ein anderer Background sein soll, der sich je nach Fensterbreite erweitert. Deswegen habe ich auch das TABLE erst da eingebaut. Wenn es eleganter geht, gerne. <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" class="smilie smilie--sprite smilie--sprite1" alt=":)" title="Smile&nbsp; &nbsp; :)" loading="lazy" data-shortname=":)" /> Ausserdem liegt das absolut positionierte DIV auch über den Rest was ja auch nicht sinn der Übung ist.</blockquote>

[QUOTE="JPS, post: 1708615, member: 293118"] [b]AW: [CSS] position absolute unter position relaitve[/b] Hier die Seite [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=utf-8" /> <title></title> <link href="style.css" media="all" rel="stylesheet" type="text/css" />  </head> <body> <div id="hdback"> <table width="100%" cellpadding="0" cellspacing="0"> <tr> <td background="images/bg_l_o.jpg" width="50%"><img src="images/spacer.gif" width="1" height="265" /></td> <td background="images/bg_r_0.jpg" width="50%"><img src="images/spacer.gif" width="1" height="265" /></td> </tr> </table></div> <div id="wrap"> <div id="content"> <div id="home"><div id="logoframe"><div id="logo"><img src="images/header_1.jpg" width="980" height="265" /></div></div> </div> </div> </div> <div id="footer"> <div id="footframe"> <div id="foot"></div> </div> </div> </body> </html> [/HTML] Hier das CSS [CODE] @charset "utf-8"; /* CSS Document */ * {margin:0;padding:0;} html, body {height: 100%;} #hdback {position:absolute; top:0; left:0; z-index:1; width:100%; height:265px;} #wrap {min-height: 100%; z-index:2;} #main, #home { overflow:auto; padding-bottom: 61px;} #footer {position: relative; margin-top: -61px; height: 60px; clear:both;} /*Opera Fix*/ body:before {/* thanks to Maleika (Kohoutec)*/ content:""; height:100%; float:left; width:0; margin-top:-32767px;/* thank you Erik J - negate effect of float*/ } #foot {height: 60px; background-image:url(../images/foot_bg.jpg); background-repeat: no-repeat; } #footframe {background-color:#c88c4c; height:60px;} #logoframe {background-color:#c88c4c; height:265px;} #logo {width:980px; margin:0 auto;} #content {width:980px; margin:0 auto;} #foot{width:980px; margin:0 auto;} #content { background-image:url(../images/bg_main.jpg); background-repeat: repeat-y; min-height: 100%; } [/CODE] Also das eigentlich Problem ist auch dieses DIV mit dem TABLE. Es soll halt rechts und links vom HEADER BILD (zentriert) ein anderer Background sein soll, der sich je nach Fensterbreite erweitert. Deswegen habe ich auch das TABLE erst da eingebaut. Wenn es eleganter geht, gerne. :) Ausserdem liegt das absolut positionierte DIV auch über den Rest was ja auch nicht sinn der Übung ist. [/QUOTE]

Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.

Authentifizierung

Wenn ▲ = 5, ▼ = 2 und ■ = 7, was ist ▲ × ▼ + ■?