login  Naam:   Wachtwoord: 
Registreer je!
 Forum

height niet meer dan 100% ?

Offline robmoorman - 09/04/2007 16:03
Avatar van robmoormanPHP interesse ok, nu heb ik wat ik voor elkaar wilde hebbem met mijn div's. Dat mijn hoogte allemaal 100% zijn en dat alles met plaatjes en achtergrondkleuren worden uitgevuld ookal er geen tekst staat. Echter kom ik nu op een ander probleem... als ik meer tekst heb en naar beneden moet gaan scrollen blijven mijn kleuren en achtergrondplaatjes op die 100% lijn zitten (onderaan de pagina...) wat daaronder zit heeft dus helemaal geen achtergrond meer....

hier mijn stukje css:
php code - Bekijk de code zonder highlighting - Klap code in 
  1. html, body {
  2. 	width: 100%;
  3. 	height: 100%;
  4. 	margin: 0px;
  5. 	color: #333333;
  6. 	font-family: Verdana, sans-serif;
  7. 	font-size: 10px;
  8. 	background-color: #ffffff;
  9. 	background-image: url('../images/achtergrond.gif');
  10. 	background-attachment; fixed;
  11. 	background-repeat: repeat-x;
  12. }
  13. #container {
  14. 	margin: 0px auto;
  15. 	width: 780px;
  16. 	height: 100%;
  17. 	background-color: #FFFFFF;
  18. }
  19. #cont_links {
  20. 	width: 360px;
  21. 	height: 100%;
  22. 	background-color: #f5f5f5;
  23. 	float: left;
  24. }
  25. #cont_rechts {
  26. 	width: 380px;
  27. 	height: 100%;
  28. 	background-image: url('../images/inhoud_bg.gif');
  29. 	background-repeat: repeat-y;
  30. 	float: left;
  31. }
  32. #schaduw_links {
  33. 	width: 20px;
  34. 	height: 100%;
  35. 	background-image: url('../images/schaduw_bg_links.gif');
  36. 	background-repeat: repeat-y;
  37. 	float: left;
  38. }
  39. #schaduw_rechts {
  40. 	width: 20px;
  41. 	height: 100%;
  42. 	background-image: url('../images/schaduw_bg_rechts.gif');
  43. 	background-repeat: repeat-y;
  44. 	float: left;
  45. }


en mijn html code:
php code - Bekijk de code zonder highlighting - Klap code in 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4.  
  5. <head>
  6. 	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  7. 	<title>robmoorman.nl</title>
  8. 	<script type="text/javascript" src="javascript/prototype.js"></script>
  9. 	<script type="text/javascript" src="javascript/scriptaculous.js?load=effects"></script>
  10. 	<script type="text/javascript" src="javascript/lightbox.js"></script>
  11. 	<script type="text/javascript" src="javascript/functies.js"></script>
  12. 	<link rel="stylesheet" type="text/css" href="template/lightbox.css" media="screen" />
  13. 	<link rel="stylesheet" type="text/css" href="template/stijl.css" media="screen" />
  14. </head>
  15.  
  16. <body>
  17.  
  18. <a name="top">
  19. <div id="container">
  20. <div id="schaduw_links"><img src="images/schaduw_links.gif" border="0px" alt="" /></div>
  21. <div id="cont_links">
  22. 	<div id="logo"></div>
  23. 	<div id="text_links">
  24. 		<h1>Welkom</h1>
  25. 		<div class="intro">Op de website van grafisch (web)designer Rob Moorman</div>
  26. 		<h1>Wat te zien</h1>
  27. 		<div class="text_onder">Op mijn website kunt u mijn werk bezichtigen. Van tekeningen tot animaties, al mijn werk is te zien op mijn website.</div>
  28. 		<h1>Profiel</h1>
  29. 		<div id="login">
  30.  
  31. 		</div>
  32. 	</div>
  33. </div>
  34. <div id="cont_rechts">
  35. 	<div id="menu">
  36. 		<div id="cont_navigatie">
  37. 			<ul id="nav_lijst">
  38. 				<li><a href="#">Home</a></li>
  39. 				<li><a href="?p=overmij">Over mij</a></li>
  40. 				<li><a href="?p=portfolio">Portfolio</a></li>
  41. 				<li><a href="?p=fotos">Fotoalbum</a></li>
  42. 				<li><a href="?p=gastenboek">Gastenboek</a></li>
  43. 			</ul>
  44. 		</div>
  45. 	</div>
  46. 	<div id="streep"></div>
  47. 	<div id="text_rechts">
  48. 		<div id="overmij_links">
  49. 			<img src="images/pijltje.gif" border="0px" alt="" /> Over mij<br/>
  50. 			<a href="overmij_opleidingen.html">Opleidingen</a><br />
  51. 			<a href="overmij_werkervaring.html">Werkervaring</a><br />
  52. 			<a href="overmij_hobbys.html">Hobby's</a>
  53. 		</div>
  54. 		<h2>Over mij</h2>
  55. 		<h3>Het leven van een grafisch ontwerper in Spe</h3>			
  56. 		<div class="text_onder">Mijn naam is Rob Moorman, ik ben geboren op 9 mei 1987  in Zwolle. In deze gezellige stad woon ik nog steeds. Tijdens mijn kinderjaren heb ik het ontwerpers licht al gezien. Ik wil altijd nieuwe dingen ontdekken. Kortom, ik zit nooit stil.</div>
  57. 		<h3>Op weg naar de top</h3>
  58. 		<div class="text_onder">Door mijn grote interesse in het ontwerpen ben ik nu student Communicatiesystemen: afstudeerrichting Multimedia & Vormgeving aan de Hanzehogeschool Groningen. In het jaar 2005/2006 heb ik Industrieel Product Ontwerp gestudeerd op hogeschool Windesheim te Zwolle. Tijdens die studie ben ik erachter gekomen dat mijn passie toch ?cht ligt bij grafisch vormgeving. Vandaar dat ik geswitched ben van studie en dit een goede keus is geweest.</div>
  59. 		<h3>De handen uit de mouw buiten studietijd</h3>
  60. 		<div class="text_onder">Naast mijn studie werk ik bij opslagbedrijf Spacewinner als beheerder. Daarvoor heb ik vier jaar gewerkt bij de Albert Heijn als vulploegleider. Ook is er tijd voor andere dingen. Ik ben sportief ingesteld, hou erg van voetbal. Daarnaast kijk ik films, luister vaak muziek, breng tijd door met mijn vrienden en vriendin. In mijn vrije tijd ben ik ook veel bezig met grafisch ontwerpen. Ik ontwerp met plezier websites voor vrienden en bekenden. En als ik achter de computer zit ben ik vaak bezig met Illustrator of Photoshop.</div>
  61. 		<div id="top"><a href="#top"><img src="images/pijltje.gif" border="0px" alt="" /> Top</a></div>
  62. 	</div>
  63. </div>
  64. <div id="schaduw_rechts"><img src="images/schaduw_rechts.gif" border="0px" alt="" /></div>
  65. </div>
  66.  
  67. </body>
  68.  
  69. </html>


het is te zien op http://www.robmoorman.nl/preview/?p=overmij

5 antwoorden

Gesponsorde links
Offline vinTage - 09/04/2007 17:22
Avatar van vinTage Nieuw lid En wat is daar niet overzichtelijk aan dan ?

Als je height 100% opgeeft, dan is de height 100% (van je scherm) en niet 130 oid.
Offline robmoorman - 10/04/2007 15:24
Avatar van robmoorman PHP interesse ja dat snap ik. maar bestaat er geen manier dat de div's wel worden opgevudl (zoals dat 100% doet) maar dan ook meer dan 100% meegaat... zodat de achtergronden niet ophouden als de grens van 100% worden overschreden..

bvd Rob
Offline nvleeuwen88 - 10/04/2007 16:57 (laatste wijziging 10/04/2007 16:58)
Avatar van nvleeuwen88 HTML interesse background: url(waar je plaatje staat) repeat-y; bedoel je misschien zoiets??

of je moet je wrapper een achtergrondplaatje geven misschien helpt dat en dan ook repeat-y doen.
Offline robmoorman - 10/04/2007 17:10 (laatste wijziging 10/04/2007 21:08)
Avatar van robmoorman PHP interesse nee nee nee haha... ik weet zo niet hoe het kan... de hele pagina (100%) is wel mooi gevuld, maar als je naar beneden scrollt, dan houd alles op dat is wel jammer... als ik die 100% weghaale enz, dan kan je wel 1 div helemala vullen, want die is net zolang jouw tekst is zeg maar... maar dan houd dan andere div weer op als je daar geen tkets meer hebt....

hier:
http://www.robmoorman.nl/school/
Offline HOND_NL - 19/04/2007 15:01
Avatar van HOND_NL Nieuw lid He gast , je kan even proberen om de height van je container geheel uit te zetten , en dmv je inline elementen de height geheel te krijgen.
Optie b is voor een footer te gaan..
Dus <div container
inhoud
</div>
<div footer > EInde van je plaatje <div>

Wat ook misschien zou kunnen werken is alleen margin-bottom aan te geven in je container naar 0 .. werkt dit nog steeds niet , knal hem dan eens naar -1px ...


succes 
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.199s