jquery - Why does my text in html not move? -


i'm coding website, , i'm trying put text under banner along other elements nothing seems going down.

https://gyazo.com/379cfa01780dddc112d06bd53a38e04b https://gyazo.com/c67ba5499d4ce188946094978f346c6a

this code

<!doctype html> <html> <head> <script type='text/javascript' src="jquery.min.js"></script> <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js'></script> <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css"> <link rel='stylesheet' href='bootstrap.min.css'>  <style> #topbanner {     position: relative; }  #topbanner  {     display: block;     margin-left:auto;     margin-right:auto; }  #topbanner:after {     -moz-box-shadow: inset 0 0 180px #defeec;     -webkit-box-shadow: inset 0 0 360px #defeec; /* paragraph controls fade on banner */     box-shadow: inset 180px 0 400px #defeec;     position: absolute;     top: 0;     left: 0;     width: 100%;     height: 100%; }  /* _______________________________________________________________________________________________________ */  #body {     background: url(stardust.png) repeat 0 0;     background-position: right; }  #container-narrow {     margin-top: 300px;     background-color: white;     position: absolute;     width: 80%;     height: 2000px; }  body {     margin-left: 10%;     margin-right: 10%;     min-height: 500px;     background-attachment: fixed;     background-position: center;     background-repeat: no-repeat;     background-size: cover; } #hcharacter {     margin-top: 50%;     position: relative;     font-family: 'chunkfive';     font-size: 100px;     text-align: center;      color: red;     z-index: 999; } @font-face {     font-family: 'chunkfive';     src: url('chunkfive.otf') format: 'opentype'; }   </style>  </head> <body id='body'>     <div id='container-narrow'></div>     <div id=topbanner>         <img src="logo%20mockup.jpg" width=1920px height=400px></img>     </div>        <div id=hcharacter>characters</div>      <p> characters</p>     <script> $.backstretch('/bgimage'); </script>  </body>  </html> 

try instead ... minor adjustments needed works

<!doctype html>     <html>    <head>     <script type='text/javascript' src="jquery.min.js"></script>     <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js'>   </script> <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css"> <link rel='stylesheet' href='bootstrap.min.css'>    <style>         #topbanner {   position: relative; }     #topbanner  {  display: block;  margin-left:auto; margin-right:auto;   }    #topbanner:after { -moz-box-shadow: inset 0 0 180px #defeec; -webkit-box-shadow: inset 0 0 360px #defeec;                 /*       paragraph controls fade on banner */  box-shadow: inset 180px 0 400px #defeec;   position: absolute;   top: 0;   left: 0;   width: 100%;   height: 100%;   } 

/* _______________________________________________________________________________________________________ */

    #body { background: url(stardust.png) repeat 0 0; background-position: right;   }         #container-narrow {         margin-top: 300px;         background-color: white;         position: absolute;         width: 80%;         height: 2000px;     }      body {         margin-left: 10%;         margin-right: 10%;             min-height: 500px;     background-attachment: fixed;     background-position: center;     background-repeat: no-repeat;     background-size: cover;     }     }       #hcharacter {         margin-top: 50%;         position: relative;         font-family: 'chunkfive';         font-size: 100px;         text-align: center;          color: red;         z-index: 999;     }         @font-face {         font-family: 'chunkfive';         src: url('chunkfive.otf') format: 'opentype';      }         </style>    </head>     <body id='body'>     <div id='container-narrow'>     <div id=topbanner>     <img src="logo%20mockup.jpg" width=1920px height=400px></img>      </div>  <div id=hcharacter>characters</div>   <p> characters</p>  </div>     <script>  $.backstretch('/bgimage');        </script>     </body> 


Comments

Popular posts from this blog

scala - 'wrong top statement declaration' when using slick in IntelliJ -

c# - DevExpress.Wpf.Grid.InfiniteGridSizeException was unhandled -

PySide and Qt Properties: Connecting signals from Python to QML -