WinFuture-Forum.de: 100% Div Nicht 100% Hoch - WinFuture-Forum.de

Zum Inhalt wechseln

Nachrichten zum Thema: Entwicklung
Seite 1 von 1

100% Div Nicht 100% Hoch


#1 _scy89_

  • Gruppe: Gäste

geschrieben 12. Oktober 2008 - 22:55

Hey

ich hab da nen Div Tag, das nicht 100% hoch sein will.

html	{
	height: 100%;
}

body {
	height: 100%;
	
	text-align: center;
}

div#hp_background	{	
	background-image: url( "../gfx/back.gif" );
	background-repeat: repeat;
	
	width: 1024px;
	height: 100%;
	
	position: relative;
	
	margin: 0px auto;
}



<html>
<head>
<link rel="stylesheet" type="text/css" href="css/css.css"/>
<link rel="stylesheet" type="text/css" href="css/layout.css"/>
</head>

<body>
<div id="hp_background">
	<div id="banner">
		<img src="gfx/banner.gif" width="1024px" height="202px">
	</div>
	
	<div id="status">
	</div>
	
	<div id="navi">
	</div>
	
	<div id="content">
		<br><br><br><br><br><br><br><br><br><br><br><br><br>
		<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
		<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
	</div>
</div>
</body>
</html>


hab den Code mal so dezimiert, das ich hier nicht ne halbe Seite voll poste. Das ist jetzt der wichtige Code, also das Element um das es geht und die Eltern-Elemente: html und body.

hab das mal hochgeladen: http://juelkenbeck.net/moritz/debug/
da sieht man das der Hintergrund, mitten drinn aufhört.

Wäre dankbar für Lösungen :P
0

Anzeige



#2 Mitglied ist offline   Ghost92 

  • Gruppe: aktive Mitglieder
  • Beiträge: 597
  • Beigetreten: 01. August 06
  • Reputation: 0
  • Geschlecht:Männlich

geschrieben 12. Oktober 2008 - 23:11

Ähm also ich hab festgestellt dass du bei " div#hp_background " das hier verwendest "background-repeat: repeat;"
Ich denke das muss aber "background-repeat: repeat-y;" heißen...

Ach und in deinem Dokument im HTML-Bereich hast du den Headteil falsch geschlossen...anstatt </head> solltest du <head /> verwenden.
Zufällig interessante Videos schauen? http://random-video.net !
0

#3 Mitglied ist offline   Gitarremann 

  • Gruppe: aktive Mitglieder
  • Beiträge: 3.263
  • Beigetreten: 04. Juni 06
  • Reputation: 3
  • Geschlecht:Männlich
  • Wohnort:Trebnitz

geschrieben 12. Oktober 2008 - 23:33

Bei der Höhe gibt es kein 100%. Auf was soll sich das denn beziehen?

Man stelle sich mal die Breite vor. Da kann man bei Text einen Zeilenumbruch machen und der Text weicht nach unten aus. Da kann man eine Breite festlegen. Da hat die Breite auch einen Bezug. Wird der Text aber nach unten zu lang, dann kann er nirgends ausweichen. Die Höhe hat da keinen Bezug. Es gibt zwar immer wieder Leute, die das versuchen aber das Ergebnis ist ein Browser der in den Quirksmodus schaltet, weil ein Zirkelbezug fabriziert wird.
Der Pessimist sagt: "Das Glas ist halb leer,"
Der Optimist sagt: "Das Glas ist halb voll."
Der Realist sagt: "Bedienung, zwei Neue!"
0

#4 Mitglied ist offline   Ludacris 

  • Gruppe: Moderation
  • Beiträge: 4.668
  • Beigetreten: 28. Mai 06
  • Reputation: 218
  • Geschlecht:Männlich

geschrieben 13. Oktober 2008 - 06:52

Beitrag anzeigenZitat (Ghost92: 13.10.2008, 00:11)

Ähm also ich hab festgestellt dass du bei " div#hp_background " das hier verwendest "background-repeat: repeat;"
Ich denke das muss aber "background-repeat: repeat-y;" heißen...

Ach und in deinem Dokument im HTML-Bereich hast du den Headteil falsch geschlossen...anstatt </head> solltest du <head /> verwenden.

ähm die <xx /> tags verwendet man doch nur wenn man keinen close tag macht, z.b.: <img src="bild.png alt="Bild" /> aber nicht bei tags wo was drinnen steht, wie <head> <title>Willkommen</title> </head>
0

#5 _scy89_

  • Gruppe: Gäste

geschrieben 13. Oktober 2008 - 07:35

<xx /> wird in der Tat nicht zum schließen verwendet, sondern nur, wenn es eben k e i n schließenden Tag gibt.

@Gitarremann:
Also kann ich im Prinzip nicht dafür sorgen, dass die div-Box auf dem gesamten anzuzeigenden Bereich, also komplette Fenster, auch angezeigt wird? Ich kann ja schlecht ne Fester Pixelangabe verwenden, wenn der Inhalt dynamisch is ,oder?!
0

#6 Mitglied ist offline   Knalltuete 

  • Gruppe: aktive Mitglieder
  • Beiträge: 227
  • Beigetreten: 24. Januar 06
  • Reputation: 1
  • Geschlecht:Männlich

geschrieben 13. Oktober 2008 - 09:09

versuch es mal mit min-height :P
(>¬_¬)>@ Keks?

Eingefügtes Bild
0

#7 Mitglied ist offline   asko 

  • Gruppe: aktive Mitglieder
  • Beiträge: 144
  • Beigetreten: 17. November 02
  • Reputation: 0

geschrieben 13. Oktober 2008 - 11:14

Beitrag anzeigenZitat (Gitarremann: 13.10.2008, 00:33)

Bei der Höhe gibt es kein 100%. Auf was soll sich das denn beziehen?


Wieso sollte es das nicht geben? Und die Höhe bezieht sich auf das umgebende Element - in dem Fall dem Viewport des Browsers.


@ scy89
Schau mal hier: http://tp.webcreate-nrw.de/2007/05/27/html...-mit-100-hoehe/
0

#8 Mitglied ist offline   Halt's_Maul_Paul 

  • Gruppe: aktive Mitglieder
  • Beiträge: 257
  • Beigetreten: 18. Dezember 04
  • Reputation: 0
  • Geschlecht:Männlich
  • Wohnort:HH

geschrieben 13. Oktober 2008 - 13:52

Der Link von asko beantwortet es zwar eigentlich schon, aber nur nochmal um die Quintessenz daraus zu ziehen:
Das HTML-Element (und ich glaube auch das BODY-Element) hat(/haben) standardmaessing einen margin/padding Wert ungleich 0, d.h. du solltest diese Abstaende erstmal komplett eleminieren mit:

body, html {
margin : 0;
padding : 0;
}


Ich mache es zB immer so, dass ich einfach alle Abstaende und Rahmen auf 0 setze, um auch dem IE zu sagen, dass er das so wie alle Anderen behandeln soll :thumbdown: 

* {
border : 0;

margin : 0;
padding : 0;
}

main-system on nethands

Gentoo - Debian - LFS
- - - - - - - - - - - - - - - - - - - - - - - - -
Beten wir alle zu unserem Schöpfer, dass der Internet Explorer 6 bald das Zeitliche segnet. Und wenn es geht, seinen jungen und auch nicht ganz koscheren Bruder mit der Nummer 7 gleich mitnimmt. (Versionsnummern natürlich beliebig austauschbar ;P )
[zitat von Peter Kropff - Tutorials HTML/CSS]
0

#9 _scy89_

  • Gruppe: Gäste

geschrieben 13. Oktober 2008 - 15:36

ok ich hab das problem gefunden, arbeite aber noch an einer passablem Lösung.

Das Ding ist: Der Hintergrund div, ist 100%, ABER da der main(content) div auch 100% hat, und sich das auf das ElternElement bezieht, also den Hintergrund div, wirkt der main div größer. Das liegt daran, das er unter dem Banner erst angfängt. Die Divs haben die selbe größer nur einer ist durch den Banner verschoben. Daher wirkt es, als wäre ein Div nicht 100%.

Edit:

Hab jetzt einfach die divs verschoben, sodass es passt. Also das Hintergrund div unters Banner. Damit hat es den gleichen Startpunkt wie main und es passt. Nicht optimal, aber besser gehts grad net^^

Dieser Beitrag wurde von scy89 bearbeitet: 13. Oktober 2008 - 15:52

0

#10 Mitglied ist offline   Gitarremann 

  • Gruppe: aktive Mitglieder
  • Beiträge: 3.263
  • Beigetreten: 04. Juni 06
  • Reputation: 3
  • Geschlecht:Männlich
  • Wohnort:Trebnitz

geschrieben 13. Oktober 2008 - 16:15

Beitrag anzeigenZitat (scy89: 13.10.2008, 08:35)

@Gitarremann:
Also kann ich im Prinzip nicht dafür sorgen, dass die div-Box auf dem gesamten anzuzeigenden Bereich, also komplette Fenster, auch angezeigt wird? Ich kann ja schlecht ne Fester Pixelangabe verwenden, wenn der Inhalt dynamisch is ,oder?!


Zumindest funktioniert eine prozentuale Höhe nicht wirklich wenn es keinen Bezug gibt. Was dein eigentliches Problem betrifft hab ich nicht wirklich verstanden, was du überhaupt vor hast.

Dieser Beitrag wurde von Gitarremann bearbeitet: 13. Oktober 2008 - 16:16

Der Pessimist sagt: "Das Glas ist halb leer,"
Der Optimist sagt: "Das Glas ist halb voll."
Der Realist sagt: "Bedienung, zwei Neue!"
0

Thema verteilen:


Seite 1 von 1

1 Besucher lesen dieses Thema
Mitglieder: 0, Gäste: 1, unsichtbare Mitglieder: 0