html - Space after footer is white? -
hello im trying make there lot of white space after footer(if can call that) picture : after "sponzori" there lot of white space u can see
here html code
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="description" content=""> <meta name="author" content=""> <title>heroic features - start bootstrap template</title> <!-- bootstrap core css --> <link href="css/bootstrap.min.css" rel="stylesheet"> <!-- custom css --> <link href="css/heroic-features.css" rel="stylesheet"> <!-- html5 shim , respond.js ie8 support of html5 elements , media queries --> <!-- warning: respond.js doesn't work if view page via file:// --> <!--[if lt ie 9]> <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script> <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script> <![endif]--> </head> <body> <!-- navigation --> <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"> <div class="container"> <!-- brand , toggle grouped better mobile display --> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> <span class="sr-only">toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="">odred izviđača "ibar"</a> </div> <!-- collect nav links, forms, , other content toggling --> <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> <ul class="nav navbar-nav"> <li> <a href="about">o nama</a> </li> <li> <a href="uprava">uprava</a> </li> <li> <a href="actions">akcije</a> </li> <li> <a href="cete">Čete</a> </li> <li> <a href="news">vijesti</a> </li> <li> <a href="contact">kontakt</a> </li> </ul> </div> <!-- /.navbar-collapse --> </div> <!-- /.container --> </nav> <center><h1>uprava odreda</h1></center> <hr> <div id="id1"></div> <div id="id2"></div> <div id="id3"></div> <div id="id4"></div> <div id="id5"></div> <div id="id6"></div> </div> </div> <div class="container"> <div class="row"> <br> <br> <div id="span4_well"><div class="span3 well"> <div id="id1"> <h3>muamer klimenta</h3> <a href="#aboutmodal" data-toggle="modal"><img src="<%= asset_path( 'muamer.png' ) %>" name="aboutme" width="140" height="140" class="img-circle"></a> <h3>načelnik</h3> <p><a href="#biografija1" class="btn btn-primary btn-large">biografija</a> <center><div id="id2"> <h3>almedin džudžević</h3> <a href="#aboutmodal" data-toggle="modal"><img src="<%= asset_path( 'muamer.png' ) %>" name="aboutme" width="140" height="140" class="img-circle"></a> <h3>starješina</h3> <p><a href="#biografija1" class="btn btn-primary btn-large">biografija</a></center> <div id="id3"> <h3>haris kalač</h3> <a href="#aboutmodal" data-toggle="modal"><img src="<%= asset_path( 'muamer.png' ) %>" name="aboutme" width="140" height="140" class="img-circle"></a> <h3>starješina/menadžer</h3> <p><a href="#biografija1" class="btn btn-primary btn-large">biografija</a> <div id="id4"> <h3>samir monić</h3> <a href="#aboutmodal" data-toggle="modal"><img src="<%= asset_path( 'muamer.png' ) %>" name="aboutme" width="140" height="140" class="img-circle"></a> <h3>sekretar</h3> <p><a href="#biografija1" class="btn btn-primary btn-large">biografija</a> <div id="id5"> <center><h3>ilda alomerović</h3> <a href="#aboutmodal" data-toggle="modal"><img src="<%= asset_path( 'muamer.png' ) %>" name="aboutme" width="140" height="140" class="img-circle"></a> <h3>Ženski starješina odreda</h3> <p><a href="#biografija1" class="btn btn-primary btn-large">biografija</a> <div id="id6"> <h3>eldin brđanin</h3> <a href="#aboutmodal" data-toggle="modal"><img src="<%= asset_path( 'muamer.png' ) %>" name="aboutme" width="140" height="140" class="img-circle"></a> <h3>predstavnik odreda</h3> <p><a href="#biografija1" class="btn btn-primary btn-large">biografija</a> </div> </div> </div> </div> </div> </div> <center><h1 id="id15">vodnici</h1></center> <hr> <div id="id2"></div> <div id="id3"></div> <div id="id15"></div> <div id="id11"></div> <div id="id10"></div> <div id="id7"></div> <div id="id8"></div> <div id="id9"></div> </div> </div> <div class="container"> <div class="row"> <div id="span3_well"><div class="span well"> <div id="id7"> <h3>rejhan hodžić</h3> <a href="#aboutmodal" data-toggle="modal"><img src="<%= asset_path( 'muamer.png' ) %>" name="aboutme" width="140" height="140" class="img-circle"></a> <h3>vodnik</h3> <p><a href="#biografija1" class="btn btn-primary btn-large">biografija</a> <center><div id="id2"> <h3>zijad kurpejović</h3> <a href="#aboutmodal" data-toggle="modal"><img src="<%= asset_path( 'muamer.png' ) %>" name="aboutme" width="140" height="140" class="img-circle"></a> <h3>vodnik</h3> <p><a href="#biografija1" class="btn btn-primary btn-large">biografija</a></center> <div id="id3"> <h3>vedad selmanović</h3> <a href="#aboutmodal" data-toggle="modal"><img src="<%= asset_path( 'muamer.png' ) %>" name="aboutme" width="140" height="140" class="img-circle"></a> <h3>vodnik</h3> <p><a href="#biografija1" class="btn btn-primary btn-large">biografija</a> </div> </div> <br> <center><h1 id="id11">marketing</h1></center> <center><div id="id10"> <h3>eldin kurpejović</h3> <a href="#aboutmodal" data-toggle="modal"><img src="<%= asset_path( 'muamer.png' ) %>" name="aboutme" width="140" height="140" class="img-circle"></a> <h3>tehnička podrška/marketing</h3></center> <center><p id="id12"><a href="#biografija1" class="btn btn-primary btn-large">biografija</a></center> </div> </div> </div> </div> </div> <!-- title --> <div class="footer"> <div class="row"> <div class="col-lg-12"> <center><h3>sponzori</h3></center> </div> </div> <!-- /.row --> <!-- page features --> <div class="row text-center"> <div class="col-md-3 col-sm-6 hero-feature"> <div class="thumbnail"> <img src="http://placehold.it/800x500" alt=""> <div class="caption"> <h3>ime sponzora</h3> <p>opis sponzora</p> <p> <a href="#" class="btn btn-primary">posjetite</a> </p> </div> </div> </div> <div class="col-md-3 col-sm-6 hero-feature"> <div class="thumbnail"> <img src="http://placehold.it/800x500" alt=""> <div class="caption"> <h3>ime sponzora</h3> <p>opis sponzora</p> <p> <a href="#" class="btn btn-primary">posjetite</a> </p> </div> </div> </div> <div class="col-md-3 col-sm-6 hero-feature"> <div class="thumbnail"> <img src="http://placehold.it/800x500" alt=""> <div class="caption"> <h3>ime spnzora</h3> <p>opis sponzora</p> <p> <a href="#" class="btn btn-primary">posjetite</a> </p> </div> </div> </div> <div class="col-md-3 col-sm-6 hero-feature"> <div class="thumbnail"> <img src="http://placehold.it/800x500" alt=""> <div class="caption"> <h3>ime sponzora</h3> <p>opis sponzora</p> <p> <a href="#" class="btn btn-primary">posjetite</a> </p> </div> </div> </div> </div> </div> </div>
and here css file
#id2 { position: relative; /* declared position allows location changes */ top: -285px; /* moves image 2px closer top of page */ } #id3 {float: right; position: relative; /* declared position allows location changes */ top: -585px; /* moves image 2px closer top of page */ } #id4 {position: relative; /* declared position allows location changes */ top: 0px; /* moves image 2px closer top of page */ left:-875px;} #id5 { position: relative; /* declared position allows location changes */ top: -287px; /* moves image 2px closer top of page */ right: -435px; } #id6 { position: relative; /* declared position allows location changes */ top: -287px; /* moves image 2px closer top of page */ right: -385px; } #id15 {position: relative; right: -125px;} #span3_well {position: relative; top:-796px; left: -14px;} #id11 {position: relative; right: -100px; top: -300px;} #id10 {position: relative; right: -95px; top: -300px;} #id12 {position: relative; top: -300px;} .row {position: relative; top: -305px;} #span4_well {position: relative; top: 250px;} .footer { position: relative; bottom: 800px; }
what here im newbie
reduce bottom
value .footer
.footer { position: relative; bottom: 15px; /* example */ }
Comments
Post a Comment