| Autor |
Nachricht |
Benutzer 4545
Account gelöscht Threadersteller
Ort: -
|
Verfasst Fr 12.10.2007 13:47
Titel höhe vom div? |
  |
|
hallo, ich möchte das sich bei folgendem code der hintergrund immer automatisch anpasst,
dh. wenn der text länger wird, so wies jetzt ist in diesem fall, sich die höhe des divs vergrößert
und der footer automatisch auch weiter nach unten kommt. was muss ich ändern damit das funktioniert?
hab schon height auf auto gestellt...
| Code: | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Kontakt</title>
<link href="stylesheet.css" rel="stylesheet" type="text/css">
<!--[if lte IE 6]>
<link rel="stylesheet" media="all" type="text/css" href="stylesheet_ie.css" />
<![endif]-->
<!--[if IE]>
<style type="text/css">
#box { height: 540px;}
/*hier wird die mindesthöhe für das box-div für den ie definiert, da dieser
das im css angegebene min-height nicht interpretiert!*/
</style>
<![endif]-->
</head>
<body>
<div id="box">
<div class="menu">
<ul>
<li><a class="hide" href="vertikal.htm"><span>Produkte</span></a>
<!--[if lte IE 6]>
<a href="vertikal.htm"><span>Produkte
<table><tr><td>
<![endif]-->
<ul>
<li><a href="vertikal.htm">Vertikal</a></li>
<li><a href="plissee.htm">Plissee</a></li>
<li><a href="rollo.htm">Rollo</a></li>
<li><a href="flvorhang.htm">Flächenvorhang</a></li>
<li><a href="jalousie.htm">Jalousie</a></li>
<li><a href="zubehoer.htm">Zubehör</a></li>
<li><a href="schiene.htm">Schiene</a></li>
<li><a href="stil.htm">Stil</a></li>
<li style="border-bottom:1px solid #AD141A; "><a href="raffrollo.htm">Raffrollo</a></li>
</ul>
<!--[if lte IE 6]>
</td></tr></table>
</a>
<![endif]-->
</li>
<li class="menuhoveronly"><a href="unternehmen.htm">Unternehmen</a></li>
</ul>
</div> <!--hier geht das menu zu-->
<div id="logobild"><img src="bilder/head_kontakt.jpg">
<img id="film" src="bilder/kontakt.jpg" width="345" height="250" alt="Kontakt">
</div>
<!--<div class="produkticon"><img src="bilder/icon_flvorhang.jpg"></div>-->
<div class="themenbalken">Unternehmen</div>
<div class="textbox3">
Ob Anfragen oder Verbesserungsvorschläge, </br>wir freuen uns,
von Ihnen zu hören! </br>
<!-- hier das kontaktformular verändern und lesen von der internetseite php kontaktformular
in favoriten -->
<table width="280px" border="0" cellpadding="1" cellspacing="10" style="padding-top: 18px;" >
<colgroup>
<col width="60">
<col width="220">
</colgroup>
<form action="kontaktformular_auswerten.php" method="post">
<tr>
<td width="10px" class="grundtext_fett">Name:</td>
<td><input name="Name" class="kontaktformular" style="width:160px; height:16px;" type="text"></td>
</tr>
<tr>
<td class="grundtext_fett">eMail:</td>
<td><input name="Email" class="kontaktformular" style="width:160px; height:16px;" type="text"></td>
</tr>
<tr>
<td class="grundtext_fett">Betreff:</td>
<td>
<div id="select"><select name="Betreff" class="kontaktformular grundtext" style="width:165px; ">
<option >Hilfe</option>
<option>Kritik</option>
<option>Werbung</option>
<option>Anfrage</option>
<option>Angebotsabgabe</option>
</select></div>
</td>
</tr>
<tr>
<td valign="top" class="grundtext_fett">Nachricht:</td>
<td><textarea name="Nachricht" class="kontaktformular" style="height:100px; width:160px;"></textarea></td>
</tr>
<tr>
<td style="padding-top:6px;" class="grundtext_fett">Rückantwort:</td>
<td class="grundtext">Ja <input name="Antwort" checked type="radio" value="ja">
Nein <input name="Antwort" type="radio" value="nein"></td>
</tr>
<!---<tr>
<td>Newsletter abonnieren:</td>
<td><input checked name="Newsletter" type="checkbox" value="ja"></td>
</tr>--->
<tr>
<td align="left" colspan="2">
<input name="Send" type="submit" value="Abschicken" class="buttonabsenden">
<input name="Reset" type="reset" value="Löschen" class="buttonabbrechen" style="margin-left:10px;"></td>
</tr>
</form>
</table>
</div>
<!--<div class="links"><a href="popup_flvorhang.htm">Dekorationsbeispiele</a></div>-->
</div> <!--hier geht die umfassende box zu -->
<div id="footer">
<a style="margin:0px 0px 0px 630px; vertical-align:middle; " href="impressum.htm">Impressum<span style="padding-left:4px;">|</span></a>
<a style="margin:0px 0px 0px 0px; vertical-align:middle" href="kontakt.htm">Kontakt<span style="padding-left:5px;">|</span></a>
<a style="margin:0px 0px 0px 0px; vertical-align:middle" href="index.htm">Home</a>
</div>
</body>
</html>
|
css
| Code: | /* CSS Document */
html/* um den hintergrund einzufärben:background-color:#F9EFE6;*/
{padding:0px; margin:0px; }
/*grundlegende einstellungen*/
body
{margin:0px; padding:0px;}
/*umschliesst das gesamte layout*/
#box
{width:800px; height:auto; min-height:540px; margin:0px auto; padding:0px;
background-image:url(bilder/hg.jpg); background-repeat:no-repeat; position:relative;}
#footer
{width:800px; min-height:17px; margin:0px auto; padding:0px;
background-color:#F5E4D2;}
#footer a
{font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px;
color: #504E53; margin:0px auto; padding:0px; text-decoration: none}
#footer a span
{text-decoration: none;}
#footer a:hover
{text-decoration: underline}
#logobild
{width:760px; height:250px; margin:0px; padding:0px; position:absolute;
top:85px; left:20px;}
#film
{position:absolute;padding:0px;margin:0px;left:415px;top:0px;}
.produkticon
{width:45px; height:45px; margin:0px; padding:0px; border: 1px solid #504E53;
position:absolute; top:373px; left:212px}
.themenbalken
{position: absolute; top:335px; left:280px; width:495px; height:15px; background-color:#AD141A;
padding: 3px 0px 0px 5px; font-family: Verdana, sans-serif; font-size:11px; font-weight: bold; color:#FFFFFF; }
.textbox1/*die textspalten in den produktseiten*/
{position: absolute; top:373px; left:280px; width:240px; height:175px; padding:0px;
margin:0px; font-family:Verdana, sans-serif; font-size:10px; line-height:12px; color:#504E53;}
.textbox2/*die textspalten in den produktseiten*/
{position:absolute; top:373px; left:540px; width:240px; height:175px; padding:0px;
margin:0px; font-family:Verdana, sans-serif; font-size:10px; line-height:12px; color:#504E53;}
.textbox1 ul, .textbox2 ul { margin-top: 0; padding-top: 0; }
.textbox1 ul li, textbox2 ul li {list-style-type:disc; padding: 0px; margin: 0px;}
.textbox3/*die textbox für längeren text*/
{position:absolute; top:373px; left:140px; width:480px; height:300px; padding:0px;
margin:0px; font-family:Verdana, sans-serif; font-size:10px; line-height:12px; color:#504E53;}
.links /*die links neben dem produkttexten*/
{position: absolute; top:432px; left:130px; width:130px; height:50px; padding:0px; margin: 0px;
text-align:right;}
.links a
{font-family: Verdana, sans-serif; font-size:10px; line-height:12px;
text-align:right; text-decoration:underline; color:#AD141A;}
.links a:hover
{color:#3E3D41; text-align:right;} |
|
|
| |
|
 |
Synoxis
Dabei seit: 07.09.2005
Ort: Roßdorf
Alter: 35
Geschlecht: 
|
Verfasst Sa 13.10.2007 18:55
Titel
|
|
|
|
Ich lass bei solchen Sachen einfach die Höhe direkt weg, die passt sich dann immer dem Inhalt an. Hatte bisher noch nie Probleme damit.
|
|
| |
   |
|
|
Anzeige
|
|
|
Benutzer 4545
Account gelöscht Threadersteller
Ort: -
|
Verfasst Mo 15.10.2007 07:34
Titel
|
|
|
huhu das bringt leider nix. 
liegt das an der min-height? hab den hack für den ie verwendet. in ff gehts aber auch nicht. muss ich das irgendiwe ändern? ...hab schon gesucht, aber irgendwie finde ich immer nur beispiele mit mehrspaltigen layouts und meins ist ja einspaltig...
Zuletzt bearbeitet von am Mo 15.10.2007 08:24, insgesamt 1-mal bearbeitet
|
|
| |
|
|
Account gelöscht
Threadersteller
Ort: -
Alter: -
|
Verfasst Mo 15.10.2007 09:02
Titel
|
|
|
Hallo,
ich bin noch nicht so vertraut mit CSS/HTML da ich es auch grade erst lerne.
Aber müsste bei "background-repeat:no-repeat" nicht "REPEAT" stehen? Denn
erst dann wird doch der Hintergrund "gestreckt" / "kopiert".
Ist aber nur ne Vermutung, da ich eben auch noch lerne. (:
=>
#box
{width:800px; height:auto; min-height:540px; margin:0px auto; padding:0px;
background-image:url(bilder/hg.jpg); background-repeat:no-repeat; position:relative;}
|
|
| |
|
|
m
Moderator
Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht:
|
Verfasst Mo 15.10.2007 10:51
Titel
|
|
|
Ich sehe keinen min-height Hack?
| Code: | #box {
min-height:540px;
height:auto !important;
height:540px;
} |
|
|
| |
|
|
SURE612
Dabei seit: 02.12.2005
Ort: Bärlin / CB
Alter: -
Geschlecht:
|
Verfasst Mo 15.10.2007 11:32
Titel
|
|
|
| Code: | #box {
min-height:540px;
!height:540px;
} |
dann klappts auch mit dem nachbarn 
|
|
| |
|
|
m
Moderator
Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht:
|
Verfasst Mo 15.10.2007 11:41
Titel
|
|
|
| SURE612 hat geschrieben: | | Code: | #box {
min-height:540px;
!height:540px;
} |
dann klappts auch mit dem nachbarn |
Man muss es ja nicht so dreckig machen wenn es auch sauber geht.
|
|
| |
|
|
SURE612
Dabei seit: 02.12.2005
Ort: Bärlin / CB
Alter: -
Geschlecht:
|
Verfasst Mo 15.10.2007 12:17
Titel
|
|
|
|
was is denn daran dreckig?
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
CSS DIV 100% Höhe
Problem mit DIV-Höhe
Div in div, höhe variabel?
DIV Problem - 100% Höhe
prob mit div 100% Höhe
[Frage] Div und Höhe
|
|
Willkommen auf dem Portal für Mediengestalter
