Difference between revisions of "Template:AFCM-Egypt"

Line 89: Line 89:
  
 
});
 
});
 +
 +
 +
// this will run this function as soon as the page is loaded...
 +
    $(function(){
 +
 +
        // bind the resize event to the window...
 +
        // this will call the 'centerMyContent' function whenever the
 +
        // window is resized...
 +
        jQuery(window).bind('resize', centerMyContent);
 +
 +
        // call the 'centerMyContent' function on the first page load...
 +
        centerMyContent();
 +
 +
    });
 +
 +
    // the actual centring function...
 +
    function centerMyContent(){
 +
 +
        // get the body and container elements...
 +
        var container = jQuery('#header');
 +
        var body = jQuery('body');
 +
 +
        // work out the top position for the container...
 +
        var top = (body.height() / 2) - (header.height() / 2);
 +
 +
        // set the container's top position...
 +
        header.css('top', top + 'px');
 +
 +
    }
 +
 +
 +
 +
 +
 +
 +
 +
 +
 +
  
  
Line 114: Line 153:
 
#content { width:100%; padding:0px;  margin-top:-5px; margin-left:0px;}
 
#content { width:100%; padding:0px;  margin-top:-5px; margin-left:0px;}
 
#header{  background-color: red; height: 10%; max-height:50px;width:100%;}
 
#header{  background-color: red; height: 10%; max-height:50px;width:100%;}
−
#body {background-color:blue;height: 90%;width:100%; }
+
body {background-color:blue;height: 90%;width:100%; }
  
 
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
 
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
−
#footer{
+
−
  background-color: orange;
+
−
    height: 65px;
+
−
    position: absolute;
+
−
    bottom: 0;
+
−
    left: 0;
+
−
    width: 100%;
+
−
}
+
  
 
/**************************************************************** MENU ***************************************************************/
 
/**************************************************************** MENU ***************************************************************/
Line 777: Line 809:
  
 
<!-- start of content -->
 
<!-- start of content -->
−
<div id="body">
+
 
−
<p>Heloooooo</p>
+
−
</div>
+
−
<div id="footer">
+
  
 
</div>
 
</div>

Revision as of 02:41, 9 August 2017