Web Analytics Made Easy -
StatCounter White space of rightside body - CodingForum

Announcement

Collapse
No announcement yet.

White space of rightside body

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • White space of rightside body

    Don't why there is still a white side at the right side of my body page, mabey somone can take a look.
    Code:
    <DOCTYPE html>
    <html>
    	<body>			
    		<header> 				
    			<link rel="stylesheet" type="text/css" href="Home.css">
    		</header>
    			
    			<div id="navigatie">
    			<h2 id="port"> Portofolio </h2>
    				<ul>				  
    				  <li><a href="hoofdpagina.html">Home</a></li>
    				  <li><a href="news.asp">About</a></li>
    				  <li><a href="contact.asp">Portoflio</a></li>
    				  <li><a href="about.asp">Contact</a></li>
    				</ul>
    			</div>
    			<div id="midcontainer">
    				<div id="blok1">
    					
    				</div>
    			
    			
    			</div>
    			<div id="footer"> 
    			<h6 id="footgrootte"> 
    				&copy Copyright 2016 My Portofolio. All Rights Reserved Izildo Pimentel. 
    			</h6>
    		</div>		
    	</body>
    </html>
    Code:
    html{
    	
    }
    header{
    	display: block;
    	text-align: center;	
    }
    
    body{
    	margin: 0;
    	background-color: #FAFAD2;	
    }
    
    #footer{
    	position: relative;
    	display: block;
    	bottom: 1px;
    	left: 1%;
    	right: 1%;
    	text-align: center;		
    }
    
    #footgrootte{	
    	bottom: 1px;
    }
    
    #navigatie
    {	
    	width: 100%;
    	text-align: center;
    	background-color: white;
    }
    
    #navigatie ul {
        list-style-type: none;
        margin: 0;
        padding: 0;	
    	position: relative;
    	text-align: center;
    	display: inline-block;
    }
    
    #navigatie li {
        display: inline;
    	float: left;	
    }
    
    #navigatie li a{
    	display: block;
    	color: grey;
    	padding: 20px 30px;
    	text-align: center;
    	text-decoration: none;	
    }
    
    #navigatie li a:hover{
    	display: block;
    	background-color: #DCDCDC;	
    }
    
    #midcontainer{	
    	border: 1px solid black;
    	width: 100%;
    	height: 100%;	
    }
    
    #blok1{		
    	border: 1px solid black;
    	width: 30%;
    	height: 50%;
    	margin: 1%;	
    }
    #port{	
    	float:left;	
    	margin-right: 1%;
    	margin-top: 1%;
    	margin-left: 8%;
    	color: grey;	
    }

  • #2
    Created a test page - no white side for me.

    Comment


    • #3
      Can you re-test it with this css.
      html{

      }
      header{
      display: block;
      text-align: center;
      }

      body{
      margin: 0;
      background-color: #FAFAD2;
      }

      #footer{
      position: relative;
      display: block;
      bottom: 1px;
      left: 1%;
      right: 1%;
      text-align: center;
      }

      #footgrootte{
      bottom: 1px;
      }

      #navigatie
      {
      width: 100%;
      text-align: center;
      background-color: white;
      }

      #navigatie ul {
      list-style-type: none;
      margin: 0;
      padding: 0;
      position: relative;
      text-align: center;
      display: inline-block;
      }

      #navigatie li {
      display: inline;
      float: left;
      }

      #navigatie li a{
      display: block;
      color: grey;
      padding: 20px 30px;
      text-align: center;
      text-decoration: none;
      }

      #navigatie li a:hover{
      display: block;
      background-color: #DCDCDC;
      }

      #midcontainer{
      border: 1px solid black;
      width: 100%;
      height: 100%;
      }

      #blok1{
      border: 1px solid black;
      width: 30%;
      height: 50%;
      margin: 1%;
      }
      #port{
      float:left;
      margin-right: 1%;
      margin-top: 1%;
      margin-left: 8%;
      color: grey;
      }

      Comment


      • #4
        The same result - no white space.

        Comment


        • #5
          Realy weird, mabey I should try another browser.

          Comment


          • #6
            Already solved the problem, footer had to big margin
            Last edited by izildop; Sep 24, 2016, 04:51 PM.

            Comment

            Working...
            X