Side bar die tot einde van de pagina loopt

Status
Niet open voor verdere reacties.

Pieterdegroote

Nieuwe gebruiker
Lid geworden
22 feb 2014
Berichten
4
graag jullie hulp bij een denk ik klein probleem...

dit is een voorlopige upload van mijn website
http://pieterdg.host56.com/index.html

zoal je ziet is er rechts een zwarte side bar die tot einde van de pagina loopt.
maar wanneer je kijkt bij portfolio loop die side bar niet door tot einde pagina.

hoe kan ik dit oplossen???

code:

HTML:
<!DOCTYPE html> 
<html>

<head>

<script src="js/jquery-1.10.2.min.js"></script>
<script src="js/lightbox-2.6.min.js"></script>
<link href="css/lightbox.css" rel="stylesheet" />
<title>Pieter D.g Photography</title>
  <meta name="description" content="website description" />
  <meta name="keywords" content="website keywords, website keywords" />
  <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
  <!-- modernizr enables HTML5 elements and feature detects -->
  <script type="text/javascript" src="js/modernizr-1.5.min.js"></script>
<link href="lightbox/css/lightbox.css" rel="stylesheet" type="text/css">
<link href="css/style.css" rel="stylesheet" type="text/css">
</head>

<body>
  <div id="main">
   
	
	<nav>
	  <div id="menubar">
        <ul id="nav">
          <li><a href="index.html">Home</a></li>
          <li><a href="Overmij.html">Over Mij</a></li>
          <li class="current"><a href="Portfolio.html">Portfolio</a></li>
          <li></li>
          <li><a href="contact.html">Contact </a></li>
        </ul>
      </div><!--close menubar-->	
    </nav>	
    
	<div id="site_content">		

      <div class="slideshow">
	    <ul class="slideshow">
          <li class="show"><img width="940" height="300" src="images/home_1.jpg" alt="&quot;A picture is worth a thousand words &quot;" /></li>
          <li><img width="940" height="300" src="images/home_2.jpg" alt="&quot;Photografie Pieter DG&quot;" /></li>
        </ul> 
	  </div><!--close slideshow-->	
	
	  <div class="sidebar_container">       
		<div class="sidebar">
          <div class="sidebar_item">
            <h2>Nieuwe Website</h2>
            <p>Welkom op mijn nieuwe website.<br>
              Neem gerust een kijkje rond!
            </p>
          </div><!--close sidebar_item--> 
        </div><!--close sidebar-->     		
		<div class="sidebar">
          <div class="sidebar_item">
            <h2>Laatste Update</h2>
            <p>Nieuwste update aanwezig</p>
            <h3>&nbsp;</h3>
</div><!--close sidebar_item--> 
        </div><!--close sidebar-->
		<div class="sidebar">
          <div class="sidebar_item">
            <h3>&nbsp;</h3>
</div><!--close sidebar_item--> 
        </div><!--close sidebar-->  		
        <div class="sidebar">
          <div class="sidebar_item">
            <h2>Contact</h2>
            <p>Gsm: 0478/50.74.49</p>
            <p><a href="mailto:pieter_de_groote@telenet.be?SUBJECT=Vraag via Site">Pieter_de_groote@telenet.be</a></p>
          </div><!--close sidebar_item--> 
        </div><!--close sidebar-->
      </div><!--close sidebar_container-->	
	
	  <div id="content">
       
          <blockquote>
        <div class="content portfolio">
     
		    <h1>Portretten</h1>
            <a href="Portfolio Portretten.html"><img src="images/elias/elias 1.jpg" width="200" height="150" alt="Portret"></a>
              
            
             
            <h1>Geboortekaarten</strong></a><strong></strong></h1>            
            
            <a href="Portfolio Geboortekaarten.html"><img src="images/ontwerpen/Kaartje (binnenkant.jpg" width="292" height="150" alt="kaartje"></a> 
            
            <h1> Comunnie / Lentefeest</h1>
            
            <a href="Portfolio Comunnie.html"><img src="images/portret 2/portret 2-3.jpg" width="200" height="100"alt="Lentefeest"></a>
            
           <h1>Eindwerk Fotografie</h1>
           <p><a href="Portfolio Eindwerk fotografie.html"><img src="images/foto's eindwerk/foto's eindwerk-01.jpg" width="200" height="100" alt="opleiding"></a></p>         
        </div>
	    <div class="content portfolio2">        
	      <h1>Natuur</h1>
	      <p><a href="Portfolio natuur.html"><img src="images/foto's opleiding 2/foto's opleiding 2-02.JPG" width="200" height="100"alt="Natuur"></a>
	        
          </p>
	      <h1> Special Effects </h1>
          <a href="Portfolio Special effects.html"  title="Special effects"><img src="images/foto's opleiding 2/effects/foto's opleiding 2-05.jpg" width="200" height="100"></a>
          
          
          <h1> Doop  </h1>
          
          <a href="Portfolio doop Siano.html" title="Doop Siano"><img src="images/doop siano/doop 7.jpg"width="100" height="150" alt="doop siano"></a>
         
          </h1>
	    </div><!--close content_imagetext--><!--close content_container--><!--close content_container-->			  
	  </div><!--close content_item-->
    </div><!--close content-->   
	
	</div>
	
	</div><!--close site_content-->  	
  
    <footer>
	  <a href="index.html">Home</a> | <a href="contact.html">Contact</a><br/>
	  <br/>
	 Copyright © All Rights Reseved. |Design by Pieter De Groote 
    </footer> 
  
<!--close main-->
  
  <!-- javascript at the bottom for fast page loading -->
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/image_slide.js"></script>

</body>
</html>
 
Laatst bewerkt door een moderator:
Waarom zou je hier enige moeite in steken? Het ziet er goed uit, waarom wil je het tot de bodem hebben eigenlijk?
 
css calc() is denk ik wat je kunt gebruiken. Of een javascript regeltje die de hoogte van de sidebar gelijk maakt aan die van je content links ervan.
 
Ik denk dat het beter zou ogen moest dit wel zijn :-)

css calc() is denk ik wat je kunt gebruiken. Of een javascript regeltje die de hoogte van de sidebar gelijk maakt aan die van je content links ervan.

hoe werkt de css calc()? nog nooit van gehoord :-)
 
Laatst bewerkt door een moderator:
Welkom op Helpmij.nl.:)

Ik heb de titel even wat duidelijker gemaakt, "Beetje hulp aub!" zegt niets over je vraag/probleem. Tevens HTML code tag in je bericht gezet, graag indien je met codes in je bericht werkt de juiste tag hiervoor gebruiken. (php, html, javascript enzovoort)
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan