| Autor |
Nachricht |
Sophie88
Threadersteller
Dabei seit: 31.05.2012
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Di 01.10.2013 14:55
Titel Wrapper soll sich 100% der Höhe des Contents anpassen... |
  |
|
Hallo zusammen,
ich hoffe, es kann mir jemand helfen.
Ich habe gerade das Problem, dass ich einen #wrapper habe, der den kompletten #content beinhaltet.
Nun soll sich der Wrapper, der eine weiße Hintergrundfarbe hat, in der Höhe immer 100% dem Content anpassen. Ich habe ihm schon ein height:100% gegeben, aber er hängt immer irgendwo unter dem Menü.
Hier der CSS Code:
| Code: | body {
margin: 0;
padding: 0;
background-color: #f4f4f4;
font: 14px Arial, Helvetica, sans-serif;
color:#5f5f5f;
text-rendering: optimizeLegibility;
line-height:20px;
text-align:justify;
}
#wrapper {
background-color: #ffffff;
width:100%;
box-shadow:4px 4px 4px rgba(0,0,0,0.1);
height: 100% !important;
position: relative;
}
#content {
width:900px;
margin: 0 auto;
padding-top:50px;
}
#logo {float:left; width:450px; height:95px; position: relative;}
#aktionslogo {float:left; width:450px; height:95px; text-align:right; position: relative;}
#navigation { background-image:url(../img/bg_menu.png); background-repeat:no-repeat; z-index:999; width:904px; height:66px; position: relative; margin-top:114px; color:#ebebeb; padding-top:12px; padding-left:15px; font-size:14px; line-height:20px; padding-bottom:20px; position: relative;}
#menu1 {float:left; width: 173px;} #menu2 {float:left; width: 137px;} #menu3 {float:left; width: 145px;} #menu4 {float:left; width: 141px;} #menu5 {float:left; width: 132px;} #menu6 {float:left; }
#submenu { width:230px; float:left; line-height:18px; text-align:left;}
#text { width:670px; float:left;} |
Hier der HTML Code
| Code: |
<!DOCTYPE HTML>
<html dir="ltr" lang="de-DE">
<head>
<meta charset="UTF-8" />
<title>x</title>
<link rel="stylesheet" type="text/css" href="css/style.css" />
</head>
<body>
<div id="wrapper">
<div id="content">
<div id="logo"><img src="img/logo.png" width="296" height="95"></div>
<div id="aktionslogo"><img src="img/logo_aktion.png" width="185"
height="76" alt="aktionslogos"></div>
<div id="navigation">
<div id="menu1"><strong>x</div>
<div id="menu2">x</div>
<div id="menu3">x</div>
<div id="menu4">x</div>
<div id="menu5">x</div>
<div id="menu6">x</div>
</div>
<div id="submenu">
<img src="img/arrow.png" width="6" height="10" alt="arrow">
x
<br><br>
<img src="img/arrow.png" width="6" height="10" alt="arrow">
x
<br><br>
<img src="img/arrow.png" width="6" height="10" alt="arrow">
x
</div>
<div id="text">
<h1>x</h1>
x
<br><br>
<img src="img/btt_x.png" width="288" height="43"
alt="x">
</div>
</div>
</body>
</html>
|
Ich hoffe sehr auf Hilfe, vielen Dank schonmal!!
|
|
| |
  |
 |
DEKONSTRUKTIV
Dabei seit: 22.06.2009
Ort: bln
Alter: -
Geschlecht: -
|
Verfasst Di 01.10.2013 14:59
Titel
|
|
|
|
dein ganzer kram floatet irgendwo in der weltgeschichte rum, darum hat dein content keine höhe, der wrapper infolge auch nich.
|
|
| |
 |
|
|
Anzeige
|
|
|
Sophie88
Threadersteller
Dabei seit: 31.05.2012
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Di 01.10.2013 15:02
Titel
|
|
|
|
kannst du mir sagen,wie ich es besser machen könnte?
|
|
| |
|
|
pantonine
Dabei seit: 03.03.2011
Ort: gehen Sie bitte weiter…
Alter: -
Geschlecht: -
|
Verfasst Di 01.10.2013 15:42
Titel
|
|
|
|
Ein Block nimmt nur die Größe von Elementen an, die eine definierte Größe haben. Also bspw. Text, Bilder oder per CSS mit Größenangaben versehene Blöcke. Voraussetzung: Der Wrapper oder seine Inhalte werden nicht aus dem Fluss genommen, per float oder Positionierung. http://jsfiddle.net/pPuQx/
|
|
| |
|
|
SimonDerDude
Dabei seit: 15.01.2010
Ort: error: undefined
Alter: 35
Geschlecht: 
|
Verfasst Di 01.10.2013 16:39
Titel
|
|
|
Alles was die Leute hier sagen wollen ist ...
| Zitat: | | Wer floatet muss auch clearen |
... urgslesenmachtmireinfachdencodeok
Zuletzt bearbeitet von SimonDerDude am Di 01.10.2013 16:40, insgesamt 1-mal bearbeitet
|
|
| |
|
|
pantonine
Dabei seit: 03.03.2011
Ort: gehen Sie bitte weiter…
Alter: -
Geschlecht: -
|
Verfasst Di 01.10.2013 16:43
Titel
|
|
|
|
Nicht wirklich. Eher: Wer floatet muss auch weiterfloaten.
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
Höhe anpassen per Js
float:left höhe anpassen
Iframe Höhe per Javascript anpassen
DIV höhe per JS anpassen - ich glaub ich werd blöd
[html/css] element soll sich immer an die höhe anpassen.
hinter wrapper schatten / bild
|
|
Willkommen auf dem Portal für Mediengestalter
