css - extra vertical space added while not needed -
i having trouble figure out why have vertical space between 2 divs
here fiddle link https://jsfiddle.net/karimmtlc/bqt1r4y2/
and here code:
<html> <head> <title>todo supply title</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> </head> <body> <div class="row-fluid"> <div id="voyage_map" style="width: 100%; height: 400px; padding:0px;margin:0px;background-color:blue;"> </div> <div id="voyage_map_container" style="z-index:1000000000000; background: rgba(0, 0, 0, 0.6);position:relative;top:-120px; min-height:120px; color:white;padding-top:0px;padding-left:10px;padding-right:10px; padding-bottom:5px;"><div class="row"><div class="col-xs-8 col-sm-8 col-md-8 col-lg-8" style="padding-top:2px;"><h3 style="padding-top:0px;"><strong>title here</strong></h3><div id="trun3">start making clients happy! shhhe ejhjdajfb fdhdf chcdb sgsghgs shgfhdg dhhdshdhfgd dcbdhhsdb start making clients happy! shhhe ejhjdajfb fdhdf chcdb sgsghgs shgfhdg dhhdshdhfgd dcbdhhsdb start making clients happy! shhhe ejhjdajfb fdhdf chcdb sgsghgs shgfhdg dhhdshdhfgd dcbdhhsdb start making clients happy! shhhe ejhjdajfb fdhdf chcdb sgsghgs shgfhdg dhhdshdhfgd dcbdhhsdb start making clients happy! shhhe ejhjdajfb fdhdf chcdb sgsghgs shgfhdg dhhdshdhfgd dcbdhhsdb sgsghgs shgfhdg dhhdshdhfgd dcbdhhsdb start making clients happy! shhhe ejhj shs sbsbhsbds sbsdbsbd start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy! start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!start making clients happy!</div></div><div class="col-xs-4 col-sm-4 col-md-4 col-lg-4 text-right" style="padding-top:5px;"><h3 style="padding-top:2px;"><strong>may 26th-29th 2015</strong></h3></div></div></div> <div style="background-color: green;min-height=100;">ssdsdsdsdsd</div> </div> </body> </html>
the vertical space want rid of between gray background , green background.
thanks
your div #voyage_map_container
relative positioned , has top:-120px;
.
edit following:
<div id="voyage_map_container" style="z-index:1000000000000; background: rgba(0, 0, 0, 0.6);position:relative;top:-120px; min-height:120px; color:white;padding-top:0px;padding-left:10px;padding-right:10px; padding-bottom:5px;">
to:
<div id="voyage_map_container" style="z-index:1000000000000; background: rgba(0, 0, 0, 0.6);position:relative; min-height:120px; color:white;padding-top:0px;padding-left:10px;padding-right:10px; padding-bottom:5px;">
if design need have element positioned have now, can add margin-bottom: -120px;
same element in order "pull" elements bellow.
Comments
Post a Comment