html - how to not let other div overlap my nav bar -


i cant seem figure out how overlap nav bar on full display when scrolling. code given below. please me lost few days. i've fixed navagation bar using position:fixed. dont know whether position of div element wrong or there should ve known earlier before making fixed navigation bar.

` 

body{    background-image:url('https://www.pixelstalk.net/wp-content/uploads/2016/04/blue-icy-ocean-wallpaper-hd.jpg');        }  *{    padding:0px;    margin:0px;  }  #maindiv{    width:100%;    height:100px;  }    #navdiv ul{    width:100%;    height:80px;     background-color:#000916;    line-height:80px;      position:fixed;  }  #navdiv ul li{    list-style-type:none;    display:inline-block;    float: right;  }  #navdiv ul a{    text-decoration:none;    color:white;    padding:20px;  }  #navdiv ul a:hover{    background:#000948;    transition: 0.40s;  }  #navdiv h1{    color:white;    float:left;    width:200px;    margin-left:20px;    margin-top:10px;    cursor:pointer;  }  #about{    width:50%;    margin:auto;    background-color:#000916;    border-radius:30px;;  }  #about p{    color:white;  }  #left-text1{    padding-left:10px;    padding-top:10px;  }  .resize{    width:400px;    height:auto;    border-radius:30px;  }
<head>    <title>portfolio</title>  </head>  <body>    <div id="maindiv">        <div id = "navdiv">          <ul>            <h1>danial</h1>            <li><a href="#" id="linkref">contact</a></li>            <li><a href="#" id="linkref">portfolio</a></li>            <li><a href="#" id="linkref">about</a></li>            <li><a href="#" id="linkref">home</a></li>          </ul>        </div>    </div>    <div id="about">      <div class="row">        <div class="col-md-6">          <p id="left-text1">welcome site<br>i front-end web developer loves cooperate , involve in projects either earned money or earned experience</p>               </div>        <div class="col-md-6">          <img class="resize"src="https://www.123freevectors.com/wp-content/uploads/digi/casual-man-standing-free-vector-17.jpg">        </div>      </div>    </div>  </body>

`

body{    background-image:url('https://www.pixelstalk.net/wp-content/uploads/2016/04/blue-icy-ocean-wallpaper-hd.jpg');        }  *{    padding:0px;    margin:0px;  }  #maindiv{    width:100%;    height:100px;  }    #navdiv ul{    width:100%;    height:80px;     background-color:#000916;    line-height:80px;      position:fixed;    /* can set want infront z-index prop */    z-index:99999;  }  #navdiv ul li{    list-style-type:none;    display:inline-block;    float: right;  }  #navdiv ul a{    text-decoration:none;    color:white;    padding:20px;  }  #navdiv ul a:hover{    background:#000948;    transition: 0.40s;  }  #navdiv h1{    color:white;    float:left;    width:200px;    margin-left:20px;    margin-top:10px;    cursor:pointer;  }  #about{    width:50%;    margin:auto;    background-color:#000916;    border-radius:30px;;  }  #about p{    color:white;  }  #left-text1{    padding-left:10px;    padding-top:10px;  }  .resize{    width:400px;    height:auto;    border-radius:30px;  }
<head>    <title>portfolio</title>  </head>  <body>    <div id="maindiv">        <div id = "navdiv">          <ul>            <h1>danial</h1>            <li><a href="#" id="linkref">contact</a></li>            <li><a href="#" id="linkref">portfolio</a></li>            <li><a href="#" id="linkref">about</a></li>            <li><a href="#" id="linkref">home</a></li>          </ul>        </div>    </div>    <div id="about">      <div class="row">        <div class="col-md-6">          <p id="left-text1">welcome site<br>i front-end web developer loves cooperate , involve in projects either earned money or earned experience</p>               </div>        <div class="col-md-6">          <img class="resize"src="https://www.123freevectors.com/wp-content/uploads/digi/casual-man-standing-free-vector-17.jpg">        </div>      </div>    </div>  </body>


Comments

Post a Comment

Popular posts from this blog

python - Selenium remoteWebDriver (& SauceLabs) Firefox moseMoveTo action exception -

while performing simple hover test on firefox through selenium (3.4.0) python bindings (3.4.3) using of available os in saucelabs (except linux, latest available firefox version old), performing following actionchain: hover = actionchains(driver) hover.move_to_element(elm_men_menu).perform() it throws following error: taceback: file [...] in testhover hover.perform() file "/usr/local/lib/python2.7/dist-packages/selenium/webdriver/common/action_chains.py", line 80, in perform action() file "/usr/local/lib/python2.7/dist-packages/selenium/webdriver/common/action_chains.py", line 290, in <lambda> command.move_to, {'element': to_element.id})) file "/usr/local/lib/python2.7/dist-packages/selenium/webdriver/remote/webdriver.py", line 256, in execute self.error_handler.check_response(response) file "/usr/local/lib/python2.7/...
Read more

html - How to custom Bootstrap grid height? -

why bootstrap grid has height 591.067 ? did height came ? .main-post { padding: 20px; background-color: #fff; border: 1px solid #d8d8d8; margin-bottom: 100px; } .main-post .post-categories { margin-bottom: 10px } .main-post h3 { margin: 0 0 10px; color: #777; letter-spacing: -1px; font-weight: bold } .main-post .post-author, .main-post .post-date, .main-post .post-comments { font-size: 12px } .main-post img { display: block; margin: 10px 0; } .main-post .post-summary { line-height: 1.7; color: #888 } .main-post { color: #999 } <div class="col-sm-6"> <div class="main-post"> <h3 class="post-title"> <a href="#"> post title </a> </...
Read more

transpose - Maple isnt executing function but prints function term -

im using maple im in worksheetmode tried using maple input , 2d input , want transpose matrix a: := `<|>`(`<,>`(1, .5, -2), `<,>`(.5, 9/4+b, 5+3*b), `<,>`(-2, 5+3*b, 18+9*b+4*a)); b:= transpose(a); when exectute sheet dont translated values, there same input. matrix looks same input matrix plus function term. you can see picture in following link: why arent functions executed? meanwhile b:=a^+ doing right way , transposed matrix. other functions return function body instead needed values... if using 2d input mode (the default) space you've got between transpose , bracketed (b) interpreted multiplcation. rid of such space. also, either load package @ start of document like, with(linearalgebra): before calling transpose command package, or call it's full name like, linearalgebra:-transpose(b);
Read more