Autor |
Nachricht |
mediaroad
Threadersteller
Dabei seit: 07.03.2007
Ort: Heide
Alter: -
Geschlecht:
|
Verfasst Mo 08.09.2008 17:33
Titel variabler Content - Rahmen & Schatten verlängern sich ni |
|
|
Hallo,
nachdem ich mich entschlossen habe den Content meiner Webseite variabel zu programmieren, sodass er sich der Textlänge anpasst habe ich nun folgendes Problem.
Der Textbereich verlängert sich wunderbar, durch die Angaben von height: auto !important. Aber der Wrapper, welcher einen Rahmen um den kompletten Content machen soll, zieht nicht mit. Genauso der Schatten der am Rand gesetzt wurde und den kompletten Content an der linken Seite begleiten soll. Auch die Angabe vonn height:100% hilft nichts.
Es folgen die CSS Validierung und der HTML Code.
Ich hoffe ihr könnt mir helfen, im Vorraus schonmal vielen Dank.
CSS Validierung:
Code: | #corpus{
width:790px;
min-height:623px;
height:623px;
height:auto !important;
margin: 0px auto;
border-style:solid;
border-color:#745848;
border-width:1px;
border-bottom:3px #745848 solid;
}
#wrapper{
width:790px;
min-height:623px;
height:623px;
height:auto !important;
}
#rahmen_links{
width:204px;
min-height:287px;
height:287px;
height:auto !important;
float:left;
font-size:1px;
}
#mainbereich{
width:586px;
min-height:335px;
height:auto !important;
height:335px;
background-color:#FFFFFF;
float:left;
}
#rahmen_main{
width:790px;
min-height:335px;
height:335px;
height:auto !important;
float:left;
}
#rahmen_textbereich{
width:586px;
min-height:335px;
height:335px;
height:auto !important;
float:left;
overflow:hidden;
}
.zweispaltig{
font-size:11px;
width:260px;
height:auto !important;
min-height:400px;
font-family:Arial, Helvetica, sans-serif;
color:#693935;
text-decoration:none;
text-align:justify;
float:left;
padding-left:25px;
padding-bottom:15px;
}
|
Der Schatten welcher mitwandern soll:
Code: | #abstand_links{
float:left;
background-image:url(../images/links.jpg);
width:204px;
min-height:68px;
height:auto !important;
height:68px;
background-repeat:repeat;
}
|
HTML:
Code: | <body>
<div id="corpus">
<div id="wrapper">
<div id="rahmen_head">
<object classid="clsid27CDB6E-AE6D-11cf-96B8-444553540000" codebase=
"http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="790" height="240">
<param name="movie" value="flash/navi_ob.swf" />
<param name="quality" value="high" />
<embed src="flash/navi_ob.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash"
width="790" height="240"></embed>
</object>
</div>
<div id="rahmen_main">
<div id="rahmen_links">
<object classid="clsid27CDB6E-AE6D-11cf-96B8-444553540000" codebase=
"http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="204" height="267" style="float:left;">
<param name="movie" value="flash/navi_links.swf" />
<param name="quality" value="high" />
<embed src="flash/navi_links.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type=
"application/x-shockwave-flash" width="204" height="267"></embed>
</object>
<div id="abstand_links"></div>
</div>
<div id="mainbereich">
<div id="rahmen_textbereich">
<div class="zweispaltig" style="width:280px;"><br /><br />
<img src="images/home.gif" width="400" height="40" border="0" alt="" /><br /><br />
<br /><br />
</div>
<div class="zweispaltig" style="padding-left:20px; width:240px;"><br /><br /><br /><br /><br /><br />
<img src="images/so.jpg" width="200" height="157" border="0" alt="" />
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
|
Zuletzt bearbeitet von mediaroad am Mo 08.09.2008 17:48, insgesamt 1-mal bearbeitet
|
|
|
|
|
therapiekind
Dabei seit: 14.03.2006
Ort: In deinem Kopf
Alter: -
Geschlecht: -
|
|
|
|
|
Anzeige
|
|
|
mediaroad
Threadersteller
Dabei seit: 07.03.2007
Ort: Heide
Alter: -
Geschlecht:
|
Verfasst Di 09.09.2008 10:36
Titel Frage hat sich erledigt |
|
|
Mein Problem hat sich inzwischen erledigt.
Trotzdem vielen Dank.
|
|
|
|
|
Kash
Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht:
|
Verfasst Di 09.09.2008 11:44
Titel Re: Frage hat sich erledigt |
|
|
mediaroad hat geschrieben: | Mein Problem hat sich inzwischen erledigt.
|
wenn du uns noch den Lösungsweg verrätst, haben später andere die über die Boardsuche diesen Fred finden auch etwas davon.
|
|
|
|
|
mediaroad
Threadersteller
Dabei seit: 07.03.2007
Ort: Heide
Alter: -
Geschlecht:
|
Verfasst Mi 10.09.2008 10:45
Titel
|
|
|
Natürlich kann ich den Lösungsweg nochmal erläutern.
Es folgt die CSS Validierung für den beweglichen Teil:
Code: | min-height:623px; /* Mindesthöhe in standardkonformen Browsern */
height:auto !important; /* !important-Regel für standardkonforme Browser, damit sie die nachfolgende height-Deklaration ignorieren */
height:623px; /* Mindesthöhe in IE<7 */
#corpus{
width:790px;
min-height:623px;
height:auto !important;
height:623px;
margin: 0px auto;
border-style:solid;
border-color:#745848;
border-width:1px;
border-bottom:3px #745848 solid;
}
.clearfix:after {
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}
.clearfix {display:inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height:1%;}
.clearfix {display:block;}
/* End hide from IE-mac */
|
Es folgt ein Beispiel der Einbindung in den HTML Code:
Code: |
<div id="corpus" class="clearfix">
|
Ihr sorgt durch diese Programmierung dafür, dass der Content (in diesem Fall der corpus) immer der Textlänge angepasst wird. Ihr müsst nun noch dem Textfeld zuweisen, das es sich auch der Textmenge anpasst. Es folgt die Einstellung für das Textfeld (CSS Validierung).
Code: |
.zweispaltig{
font-size:11px;
width:260px;
height:auto !important;
font-family:Arial, Helvetica, sans-serif;
color:#693935;
text-decoration:none;
text-align:justify;
float:left;
padding-left:25px;
padding-bottom:15px;
}
|
Ich hoffe ich konnte euch weiterhelfen mit diesem Beitrag.
|
|
|
|
|
|
|
|
Ähnliche Themen |
Variabler Header/Footer in Höhe - fester Content - WIE?
Rahmen um Objekte in DIV Content
CSS PNG-Rahmen/-Schatten an allen Seiten
Content Editing, statt Content Management
Float mit variabler Containergröße
Freehand - Variabler Strich (Werkzeug)
|
|