8 Replies - 958 Views - Last Post: 19 September 2015 - 09:46 PM

#1 964758   User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 6
  • Joined: 18-September 15

The problem with empty space after footer

Posted 18 September 2015 - 11:50 PM

Hi, friends ! I have a problem with empty space after footer. In what may be a reason ? (Photo and .rar archive on my site I attached below). I will be waiting for your replies, thanks in advance !


link on my site in rar archive

Attached image(s)

  • Attached Image

Is This A Good Question/Topic? 0
  • +

Replies To: The problem with empty space after footer

#2 Dormilich   User is offline

  • 痛覚残留
  • member icon

Reputation: 4212
  • View blog
  • Posts: 13,305
  • Joined: 08-June 10

Re: The problem with empty space after footer

Posted 19 September 2015 - 01:01 AM

Quote

In what may be a reason ?


HTML only stretches as far as the content goes.

there are some tricks, though, to work around that (Google is your friend).
Was This Post Helpful? 0
  • +
  • -

#3 964758   User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 6
  • Joined: 18-September 15

Re: The problem with empty space after footer

Posted 19 September 2015 - 01:43 AM

Bwfore to write here, I searched for information in the various search engines

This post has been edited by andrewsw: 19 September 2015 - 03:32 AM
Reason for edit:: Removed previous quote, just press REPLY

Was This Post Helpful? 0
  • +
  • -

#4 andrewsw   User is offline

  • So Smart! S-M-R-T!
  • member icon

Reputation: 6578
  • View blog
  • Posts: 26,722
  • Joined: 12-December 12

Re: The problem with empty space after footer

Posted 19 September 2015 - 03:32 AM

Post relevant code directly here between code tags, and not just as a rar which most people will not download.
Was This Post Helpful? 0
  • +
  • -

#5 964758   User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 6
  • Joined: 18-September 15

Re: The problem with empty space after footer

Posted 19 September 2015 - 10:47 AM

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Home Page</title>
	  <!-- Demo CSS -->
	<link rel="stylesheet" href="css/flexslider.css" type="text/css" media="screen" />
  <link rel="stylesheet" href="css/flexslider2.css" type="text/css" media="screen" />
	
	<!-- Modernizr -->
  	<script src="js/modernizr.js"></script>
	<link rel="stylesheet" type="text/css" href="css/style.css" />
	
</head>
<body>
<div class="structure">

	    <div class="header">
	       <a href="#"><img src="images/logo.png" class="logo" alt="logo"/></a>
	       
	       		<img src="images/about.png" class="about-img" alt="about"/>

                <form>
                    <img src="images/search-icon.png" class="search-icon">
                    <input type="text" placeholder="Search" class="radius" name="search">
                </form>
	       	
		   <ul class="menu">
	        <li><a href="#">Home</a></li>
			<li><a href="#" class="about-bt">About</a>
		<ul>
			<li><a href="#">Our team</a></li>
			<li><a href="#">Customers</a></li>
			<li><a href="#">Vacancies</a></li>
		</ul>
	</li>
	<li><a href="#">Services</a></li>
	<li><a href="#">Portfolio</a></li>
	<li><a href="#">Get in touch</a></li>
	<li><a href="#">Blog</a></li>
</ul>
	
	</div>
   </div>

   <!-- <div class="slider"> -->
        <div class="flexslider">
          <ul class="slides">
            <li>
  	    	    <img src="images/slide.png" />
  	    	    <div class="sli-text">
  	    	    <h2>Recent work</h2>
  	    	    <h1>The Project</h1>
  	    	    <p>Lorem ipsum dolor sit amet consectetuer adipiscing elit nunc ullamcorper blandit urna. Sed facilisis accumsan nisi. Ut mattis libero quis sapien. Integer fermentum venenatis libero.</p>
  	    	    </div>
  	    		</li>
  	    		
  	    		<li>
  	    	    <img src="images/slide.png" />
  	    	    <div class="sli-text">
  	    	    <h2>Recent work</h2>
  	    	    <h1>The Project</h1>
  	    	    <p>Lorem ipsum dolor sit amet consectetuer adipiscing elit nunc ullamcorper blandit urna. Sed facilisis accumsan nisi. Ut mattis libero quis sapien. Integer fermentum venenatis libero.</p>
  	    	    </div>
  	    		</li>
  	    		
  	    		<li>
  	    	    <img src="images/slide.png" />
  	    	    <div class="sli-text">
  	    	    <h2>Recent work</h2>
  	    	    <h1>The Project</h1>
  	    	    <p>Lorem ipsum dLorem ipsum dolor sit amet consectetuer adipiscing elit nunc ullamcorper blandit urna. Sed facilisis accumsan nisi. Ut mattis libero quis sapien. Integer fermentum venenatis libero.</p>
  	    	    </div>
  	    		</li>
  	    		
  	    		<li>
  	    	    <img src="images/slide.png" />
  	    	    <div class="sli-text">
  	    	    <h2>Recent work</h2>
  	    	    <h1>The Project</h1>
  	    	    <p>Lorem ipsum dolor sit amet consectetuer adipiscing elit nunc ullamcorper blandit urna. Sed facilisis accumsan nisi. Ut mattis libero quis sapien. Integer fermentum venenatis libero.</p>
  	    	    </div>
  	    		 </li>
			      </ul>
           </div>
        <!-- <div class="next-img"><img src="images/next.png"></div> -->
        <!-- </div> -->
        <!-- jQuery -->
          <div class="service-main">
            <div class="service">
              <!-- <div class="service-content"> -->
                
                 <h2>Web design</h2>

                  <p>Lorem ipsum dolor sit amet consectetuer adipiscing elit nunc ullamcorper blandit urna. Sed facilisis accumsan nisi. Ut mattis libero quis sapien. Integer fermentum venenatis libero.</p> 
                  <img src="images/web_design_img.png" class="web_design_img" />
                  <a href="#"><img src="images/place_order_btn.png" class="place_order_btn" /></a>
                <!-- </div> -->
               </div> 
               <img src="images/separator.png" class="separator1" />



               <div class="service">
              <!-- <div class="service-content"> -->
                
                 <h2>Web development</h2>
                  <p>Lorem ipsum dolor sit amet consectetuer adipiscing elit nunc ullamcorper blandit urna. Sed facilisis accumsan nisi. Ut mattis libero quis sapien. Integer fermentum venenatis libero.</p> 
                  <img src="images/web_development_img.png" class="web_development_img" />
                  <a href="#"><img src="images/place_order_btn.png" class="place_order_btn" /></a>
               <!-- </div>  -->
               </div>
              <img src="images/separator.png" class="separator2" />


               <div class="service">
                  <!-- <div class="service-content"> -->
                 <h2>Online marketing</h2>
                  <p>Lorem ipsum dolor sit amet consectetuer adipiscing elit nunc ullamcorper blandit urna. Sed facilisis accumsan nisi. Ut mattis libero quis sapien. Integer fermentum venenatis libero.</p> 
                  <img src="images/online_marketing_img.png" class="online_marketing_img" />
                  <a href="#"><img src="images/place_order_btn.png" class="place_order_btn" /></a>
               <!-- </div> -->
               </div>
				<img src="images/services.png" class="services_img" />
	 </div>
    </div>
   </div>
   <!-- flexslider_2 START -->
   <div class="flexslider2">
          <ul class="slides">
            <li>
              
              <div class="sli-text2">
              <h2>Features</h2>
              <h1>The most common goes here</h1>
              <p>Etiam dignissim lectus id diam varius egestas. Curabitur vel libero massa. Phasellus scelerisque est ac enim interdum pharetra. Nam tristique venenatis tortor non interdum.</p>
              </div>
            </li>
            
            <li>
              
              <div class="sli-text2">
              <h2>Features</h2>
              <h1>The most common goes here</h1>
              <p>Etiam dignissim lectus id diam varius egestas. Curabitur vel libero massa. Phasellus scelerisque est ac enim interdum pharetra. Nam tristique venenatis tortor non interdum.</p>
              </div>
            </li>
            
            <li>
              
              <div class="sli-text2">
              <h2>Features</h2>
              <h1>The most common goes here</h1>
              <p>Etiam dignissim lectus id diam varius egestas. Curabitur vel libero massa. Phasellus scelerisque est ac enim interdum pharetra. Nam tristique venenatis tortor non interdum.</p>
              </div>
            </li>
            
            <li>
              
              <div class="sli-text2">
              <h2>Features</h2>
              <h1>The most common goes here</h1>
              <p>Etiam dignissim lectus id diam varius egestas. Curabitur vel libero massa. Phasellus scelerisque est ac enim interdum pharetra. Nam tristique venenatis tortor non interdum.</p>
               </div>
              </li>
             </ul>
             <img src="images/separator.png" class="separator3" />
             <img src="images/flex-shadow.png" class="flex-shadow" />
            </div>



           <!-- flexslider_2 END -->


           <div class="block_updates">
            <div class="block_updates_news">
              
                
                 <h2>Updates & News</h2>

                  <span>May 20th</span><p>Praesent eu nulla vitae elit interdum</p>
                  <span>Apr 1st</span><p>Nam tristique venenatis tortor interdum</p>
                  <span>Feb 8th</span><p>Aenean et mauris massa</p>
                  
                  <a href="#"><img src="images/block_updates_news_btn.png" class="block_updates_news_btn" /></a>
                <!-- </div> -->
               </div> 


   </div>
              <div class="footer">
                

               </div>


  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
  <script>window.jQuery || document.write('<script src="js/libs/jquery-1.7.min.js">\x3C/script>')</script>

  <!-- FlexSlider -->
  <script defer src="js/jquery.flexslider.js"></script>

  <script type="text/javascript">
    $(function(){
      SyntaxHighlighter.all();
    });
    $(window).load(function(){
      $('.flexslider').flexslider({
        animation: "slide",
        start: function(slider){
          $('body').removeClass('loading');
        }
      });
      $('.flexslider2').flexslider({
        animation: "slide",
        start: function(slider){
          $('body').removeClass('loading');
        }
       }); 
    });
  </script>


  <!-- Syntax Highlighter -->
  <script type="text/javascript" src="js/shCore.js"></script>
  <script type="text/javascript" src="js/shBrushXml.js"></script>
  <script type="text/javascript" src="js/shBrushJScript.js"></script>

  <!-- Optional FlexSlider Additions -->
  <script src="js/jquery.easing.js"></script>
  <script src="js/jquery.mousewheel.js"></script>
  <script defer src="js/demo.js"></script>
</body>
</html>


  	    	    



*{
	margin: 0;
	padding: 0;
}

ul {
	list-style: none;
}

a {
	text-decoration: none;
}

body {
	background: url(../images/bg-body.png) no-repeat 50% 0;
	font-family: Tahoma, Arial, sans-serif; font-family: Tahoma, Arial, sans-serif; 
	font-size: 14px;
	line-height: 1.3;
	color: #888b8c;
    padding: 0;
    margin: 0;
}

h1, h2, h3, h4, h5, h6 {
	font-family: Tahoma, Arial, sans-serif; 
	font-weight: normal;
}


.structure {
	width: 940px; margin: 0 auto; 
	margin-top: 8px;
	background:url(../images/wrapper2.png) no-repeat;
	height: 813px;
    
}

.logo {
	float: left;
    margin: 13px 0 24px 19px;
}

.menu {
	 background: #3c4344 none repeat scroll 0 0;
    box-shadow: 0 0 5px #888;
    display: inline-block;
    list-style: outside none none;
    padding-left: 10px;
    position: relative;
    top: -16px;
    width: 930px;
    z-index: 101;
}

.menu li {
	float: left;
	display: inline;
	width: 100px;
	height: 36px;
	border: 1px solid #595f60;
	background-color: #3c4344;
}

.menu li:hover {
	background-color: #fefefe;
}

.menu a {
	display: block;
	padding: 9px;
	text-align: center;
	text-decoration: none;
	color: #8a8d8e;
	font-weight: normal;
	font-family: Tahoma, Arial, sans-serif; font-family: Tahoma, Arial, sans-serif; 
}

.menu a:hover {
	color: #8a8d8d;
}
.menu li ul {
	display: none;
}


.menu li:hover ul {
	display: block;
	
}


div {
 	/*margin: 119px auto;*/
 	width: 940px;
 	
}

.menu li ul li  {
	width: 160px;
	background-color: #fefefe;
	border: none;
	
	
}

.menu li ul li a {
	text-align: center;
}

.menu li ul li a:hover {
	color: #3c4344;
}

.about-img {
	left: -52px;
    position: relative;
    top: 77px;
    z-index: 99999;
}
.menu li a .about-bt {
	position: absolute;
}

.sli-text  {
	 float: left;
    margin-left: 8%;
    margin-top: 62px;
    width: 22%;
   
}



/* SEARCH */

.radius {
	color: #767b7c;
    float: right;
    font-family: Tahoma,Arial,sans-serif;
    font-size: 11px;
    height: 24px;
    padding-left: 5px;
    position: relative;
    right: 30px;
    top: 3px;
    width: 150px;
    border-radius: 2px;
}

.search-icon {
	left: 651px;
    position: relative;
    top: 9px;
    z-index: 500;
}

/*.next-img {
	left: 431px;
    margin: 0 auto;
    position: relative;
    top: -747px;
    width: 23px;
    z-index: 99999;
}*/

.service-main {
    background: rgba(0, 0, 0, 0) url("../images/placeholder.png") no-repeat scroll center top;
    margin: 8px auto;
    /*overflow: hidden;*/
    
    position: relative;
    top: -707px;
    width: 920px;
    height: 178px;
}

.service {
    margin: -14px auto 30px;
    overflow: hidden;
}

.service {
    float: left;
    width: 32%;
}

/*.service-content div {
    background: #fff none repeat scroll 0 0;
    font-size: 11px;
    line-height: 1.5;
    margin: 120px 10px 0;
    padding: 20px 10px;
    text-align: center;
}
*/

.service-content div  {
	height: 100%;
}

.service p {
	color: #888b8c;
    font-family: Tahoma;
    font-size: 11px;
    margin: 34px 0 0 78px;
}

.service h2 {
    margin: 13px 0 -23px 22px;
    padding-top: 16px;
    color: #3c4344;
}


.separator1 {
    left: -582px;
    position: relative;
    top: 20px;
}


.separator2 {
    position: relative;
    top: 20px;
    left: -289px;
}

.web_design_img {
    position: relative;
    top: -68px;
	left: 23px;

}

.web_development_img {
	position: relative;
	top: -68px;
	left: 23px;
}


.online_marketing_img {
	position: relative;
	top: -68px;
	left: 23px;
}

.services_img {
    position: relative;
    top: -208px;
    left: -571px;
    
}

.place_order_btn {
    position: relative;
    top: -17px;
	left: 30px;
}

.block_updates_news p {
    color: #2a80a7;
    font-family: Tahoma;
    font-size: 11px;
    left: -11px;
    line-height: 0.2em;
    margin: -3px 0 0 93px;
    position: relative;
    top: -6px;
}

.block_updates_news h2 {
    color: #a1a4a5;
    font-size: 14px;
    margin: -10px 0 10px 19px;
    padding-top: 16px;
}

/*.block_updates_news {
    float: left;
    position: relative;
    right: -610px;
    top: -195px;
    width: 32%;
}*/

.block_updates_news span {
    padding-left: 20px;
    font-size: 11px;
}


.block_updates_news_btn {
    left: 19px;
    position: relative;
    top: 11px;
}



.block_updates {
    height: 124px;
    left: 300px;
    margin: 0 auto;
    overflow: hidden;
    position: relative;
    top: -858px;
    width: 287px;
    margin-top: 5xp;
}


.footer {
    background: rgba(0, 0, 0, 0) url("../images/footer.png") no-repeat scroll 0 0;
    height: 166px;
    margin: 0 auto;
    position: relative;
    top: -822px;
}

.flexslider2 .flex-shadow {
    background: rgba(0, 0, 0, 0) url("../images/flex-shadow.png") no-repeat scroll 0 0;
    bottom: -145px;
    margin: 0 auto;
    position: relative;
    
    
}




/*
 * jQuery FlexSlider v2.2.0
 * http://www.woothemes.com/flexslider/
 *
 * Copyright 2012 WooThemes
 * Free to use under the GPLv2 license.
 * http://www.gnu.org/licenses/gpl-2.0.html
 *
 * Contributing author: Tyler Smith (@mbmufffin)
 */


/* Browser Resets
*********************************/
.flex-container a:active,
.flexslider2 a:active,
.flex-container a:focus,
.flexslider2 a:focus  {outline: none;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none;}

/* Icon Fonts
*********************************/
/* Font-face Icons */
/*@font-face {
	font-family: 'flexslider-icon';
	src:url('fonts/flexslider-icon.eot');
	src:url('fonts/flexslider-icon.eot?#iefix') format('embedded-opentype'),
		url('fonts/flexslider-icon.woff') format('woff'),
		url('fonts/flexslider-icon.ttf') format('truetype'),
		url('fonts/flexslider-icon.svg#flexslider-icon') format('svg');
	font-weight: normal;
	font-style: normal;
}*/

/* FlexSlider Necessary Styles
*********************************/
.flexslider2 {margin: 0; padding: 0;}
.flexslider2 .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */
/*.flexslider2 .slides > li {background:url(../images/slide-bg.png) no-repeat; }*/
.flexslider2 .slides > li h2 {
	color: ##a1a4a5; font-weight: normal; font-size: 16px; 
	font-family: Arial, "Trebuchet MS", Helvetica,sans-serif;
	line-height: 1.5em;
}
.flexslider2 .slides > li h1 {
	color: #3c4344; font-weight: normal; font-size: 24px; 
	font-family: Arial, "Trebuchet MS", Helvetica,sans-serif;
	line-height: 1.5em;
}
.flexslider2 .slides > li p {
	color: #767b7c; font-weight: normal; font-size: 11px; 
	font-family: Tahoma, Arial, "Trebuchet MS", Helvetica,sans-serif;
	line-height: 1.5em;
}
/*.flexslider2 .slides sli-text2  {
	float: left;
	width: 30%;

}*/

.flex-pauseplay span {text-transform: capitalize;}

/* Clearfix for the .slides element */
.slides:after {content: "\0020"; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
html[xmlns] .slides {display: block;}
* html .slides {height: 1%;}

/* No Javascript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {display: block;}

/* FlexSlider Default Theme
*********************************/
.flexslider2 { /*margin: 0 0 60px;*/ /*background: #fff;*/ /*border: 4px solid #fff; */position: relative; -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; -webkit-box-shadow: 0 1px 4px rgba(0,0,0,.2); -moz-box-shadow: 0 1px 4px rgba(0,0,0,.2); -o-box-shadow: 0 1px 4px rgba(0,0,0,.2); /*box-shadow: 0 1px 4px rgba(0,0,0,.2);*/ zoom: 1; left: 242px; top: -708px; }
.flexslider2 {
	border-radius: 4px;
    height: 158px;
    left: 0;
    margin: 0 auto;
    overflow: hidden;
    position: relative;
    
}
.flex-viewport { max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; }
.loading .flex-viewport { max-height: 300px; }
.flexslider2 .slides { zoom: 1; }
.carousel li { margin-right: 5px; }

/* Direction Nav */
.flex-direction-nav {*height: 0;}
.flex-direction-nav a  { display: block; width: 40px; height: 40px; margin: -20px 0 0; position: absolute; top: 50%; z-index: 10; overflow: hidden; opacity: 0; /*cursor: pointer;*/ color: rgba(0,0,0,0.8); text-shadow: 1px 1px 0 rgba(255,255,255,0.3); -webkit-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease; text-indent: 99999999px; }
.flex-direction-nav .flex-prev { left: -50px; }
.flex-direction-nav .flex-next { right: -50px; text-align: right; }
.flexslider2:hover .flex-prev { opacity: 0.7; left: 10px; }
.flexslider2:hover .flex-next { opacity: 0.7; right: 10px; }
.flexslider2:hover .flex-next:hover, .flexslider2:hover .flex-prev:hover { opacity: 1; }
.flex-direction-nav .flex-disabled { opacity: 0!important; filter:alpha(opacity=0); cursor: default; }
.flex-direction-nav a:before  { font-family: "flexslider-icon"; font-size: 40px; display: inline-block; content: '\f001'; }
.flex-direction-nav a.flex-next:before  { content: '\f002'; }

/* Pause/Play */
.flex-pauseplay a { display: block; width: 20px; height: 20px; position: absolute; bottom: 5px; left: 10px; opacity: 0.8; z-index: 10; overflow: hidden; cursor: pointer; color: #000; }
.flex-pauseplay a:before  { font-family: "flexslider-icon"; font-size: 20px; display: inline-block; content: '\f004'; }
.flex-pauseplay a:hover  { opacity: 1; }
.flex-pauseplay a.flex-play:before { content: '\f003'; }

/* Control Nav */
.flexslider2 .flex-control-nav {
    position: relative;
    top: 20px;
    left: -390px;
}
/*.flex-control-nav .next-img div {
	position: absolute;
}*/

.flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline;}
.flex-control-paging li a {width: 11px; height: 11px; display: block; background: #666; background: rgba(0,0,0,0.5); cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; -webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); -moz-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); -o-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); box-shadow: inset 0 0 3px rgba(0,0,0,0.3); }
.flex-control-paging li a:hover { background: #333; background: rgba(0,0,0,0.7); }
.flex-control-paging li a.flex-active { background: #000; background: rgba(0,0,0,0.9); cursor: default; }

.flex-control-thumbs {margin: 5px 0 0; position: static; overflow: hidden;}
.flex-control-thumbs li {width: 25%; float: left; margin: 0;}
.flex-control-thumbs img {width: 100%; display: block; opacity: .7; cursor: pointer;}
.flex-control-thumbs img:hover {opacity: 1;}
.flex-control-thumbs .flex-active {opacity: 1; cursor: default;}



.sli-text2 {
	float: left;
    margin-left: 4%;
    margin-top: -30px;
    overflow: hidden;
    width: 60%;
}


/*FLEX2 Separator*/
.flexslider2 .separator3  {
 
    position: absolute;
    left: 609px;
    position: absolute;
}

@media screen and (max-width: 860px) {
  .flex-direction-nav .flex-prev { opacity: 1; left: 10px;}
  .flex-direction-nav .flex-next { opacity: 1; right: 10px;}
}


Was This Post Helpful? 0
  • +
  • -

#6 andrewsw   User is offline

  • So Smart! S-M-R-T!
  • member icon

Reputation: 6578
  • View blog
  • Posts: 26,722
  • Joined: 12-December 12

Re: The problem with empty space after footer

Posted 19 September 2015 - 01:44 PM

Your .footer has
    position: relative;
    top: -822px;


The div above it (.block_updates) has
    position: relative;
    top: -858px;


This continues to many other elements:
.separator1 {
    left: -582px;
    position: relative;
    top: 20px;
}


.separator2 {
    position: relative;
    top: 20px;
    left: -289px;
}


This is not how a web page is built and it should hardly be a surprise that elements are out of position.

Pushing elements around with left and top is a very clear statement that you haven't studied or understood CSS.

Study CSS.

(I think you also have mis-matched DIV tags in your HTML.)

I hope that you are not being paid to build this site.

This post has been edited by andrewsw: 19 September 2015 - 01:45 PM

Was This Post Helpful? 0
  • +
  • -

#7 andrewsw   User is offline

  • So Smart! S-M-R-T!
  • member icon

Reputation: 6578
  • View blog
  • Posts: 26,722
  • Joined: 12-December 12

Re: The problem with empty space after footer

Posted 19 September 2015 - 02:05 PM

Have you tested your page at different browser sizes and screen resolutions? On my little laptop my rendition of your page has the footer half-way up the page, overlapping other content??!!

This post has been edited by andrewsw: 19 September 2015 - 02:06 PM

Was This Post Helpful? 0
  • +
  • -

#8 964758   User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 6
  • Joined: 18-September 15

Re: The problem with empty space after footer

Posted 19 September 2015 - 09:40 PM

Thank you friends for your replies, I everything understood.
Was This Post Helpful? 0
  • +
  • -

#9 964758   User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 6
  • Joined: 18-September 15

Re: The problem with empty space after footer

Posted 19 September 2015 - 09:46 PM

Please, recommend me a good book on layout from PSD to HTML+CSS+JS
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1