html - How to vertically align text with center of image when using Bootstrap. -

-

i trying create header website. want have logo @ top left corner , nav bar @ top right corner of window. issue nav bar not aligned flush center of logo. here's goods: 

#logoheader {  	float: left;  	vertical-align: middle;  }    ul {  	list-style: none;  	display: inline block;  	vertical-align: middle;      }    li {  	float: right;   	padding: 10px;  	font-size: 22pt;  	display: inline-block;  }    .header .navcontainer {  	height: 131px;  	vertical-align: middle;  }
<!doctype html>   <html>    <head>  	<meta charset = "utf-8">  	<meta name="viewport" content="width=device-width, initial-scale=1">  	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mtjoasx8j1au+a5wdvnpi2lkffwweaa8hdddjzlplegxhjvme1fgjwpgmkzs7" crossorigin="anonymous">  	<link type= "text/css" rel="stylesheet" href="all.css"/>  	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0msbjdehialfmubbqp6a4qrprq5ovfw37prr3j5elqxss1yvqotnepnhvp9aj7xs" crossorigin="anonymous"></script>  	<script type = "text/javascript" src = "index.js"></script>  	  	<title>jm</title>   </head>    <body>     <div class ="container">    	<div class="row">      	<div class="col-md-4 header">      	<img id = "logoheader" src="file:///users/jon/desktop/jm.com/images/bigjm.png"/>       	</div>      	<div class="cold-md-8 navcontainer">          <ul class = "navbar">          	<li>home</li>          	<li>blog</li>          	<li>publications</li>          	<li>contact</li>          </ul>      	</div>     	</div>    </div>    </body>  </html>

follow bootstraps rules

http://getbootstrap.com/components/#navbar

<!doctype html>  <html>    <head>      <link rel="stylesheet"     href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"   integrity="sha384-1q8mtjoasx8j1au+a5wdvnpi2lkffwweaa8hdddjzlplegxhjvme1fgjwpgmkzs7" crossorigin="anonymous">    </head>    <body>      <nav class="navbar navbar-default">        <div class="container-fluid">          <!-- brand , toggle grouped better mobile display -->          <div class="navbar-header">            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">              <span class="sr-only">toggle navigation</span>              <span class="icon-bar"></span>              <span class="icon-bar"></span>              <span class="icon-bar"></span>            </button>            <a class="navbar-brand" href="#">brand</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 navbar-right">              <li class="active"><a href="#">link <span class="sr-only">(current)</span></a></li>              <li><a href="#">link</a></li>              <li class="dropdown">                <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">dropdown <span class="caret"></span></a>                <ul class="dropdown-menu">                  <li><a href="#">action</a></li>                  <li><a href="#">another action</a></li>                  <li><a href="#">something else here</a></li>                  <li role="separator" class="divider"></li>                  <li><a href="#">separated link</a></li>                  <li role="separator" class="divider"></li>                  <li><a href="#">one more separated link</a></li>                </ul>              </li>            </ul>          </div><!-- /.navbar-collapse -->        </div><!-- /.container-fluid -->      </nav>    <body>    </html>

    </div><!-- /.navbar-collapse -->   </div><!-- /.container-fluid --> </nav>

Comments

Post a Comment

Popular posts from this blog

sql - VB.NET Operand type clash: date is incompatible with int error -

-
i trying display records table named staffpresentee database using clause... i using visual studio 2010... the table design follows- .......fieldname..................datatype........allownull 1......staff_id (fk).............numeric(18,0)......yes 2.......date........................date.............no 3......present.....................char(1)..........yes note type of 2nd field date , not datetime... i want display records table have today's date int 'date' field... current query is- cmd = new sqlclient.sqlcommand("select * staffpresentee date=" & date.now.date, cn) dr = cmd.executereader for dr = cmd.executereader error "operand type clash: date incompatible int" i tried select * staffpresentee query without clause runs correctly. try putting date value in sigle quotes maybe. cmd = new sqlclient.sqlcommand("select * staffpresentee date='" & _
Read more

SVG stroke-linecap doesn't work for circles in Firefox? -

-
i've got problem svg stroke-linecap attribute. i've got circular progress bar in angularjs , set outer circle (blue one) have rounded "ends". @ fiddle . <svg ... height="130" width="130"> <!-- ngif: background --> <circle ... ng-if="background" fill="#fff" class="ng-scope" stroke-width="13" stroke="#cc3399" r="57.5" cy="65" cx="65" stroke-linecap="round" /> <!-- end ngif: background --> <circle ... fill="none" stroke-dashoffset="36.12831551628261" stroke-dasharray="361.28315516282623" stroke-width="13" stroke="#432db3" stroke-linecap="round" r="57.5" cy="65" cx="65" transform="rotate(-89.9, 65, 65)" /> </svg> how can that?
Read more

python - TypeError: Scalar value for argument 'color' is not numeric in openCV -

-
here code im = cv2.imread('luffy.jpg') gray = cv2.cvtcolor(im,cv2.color_bgr2gray) ret,thresh = cv2.threshold(gray,127,255,0) contours,h = cv2.findcontours(thresh,cv2.retr_tree,cv2.chain_approx_simple) cnt in contours: moment = cv2.moments(cnt) c_y = moment['m10']/(moment['m00']+0.01) c_x = moment['m01']/(moment['m00']+0.01) centroid_color = im[c_x,c_y] centroid_color = np.array((centroid_color[0],centroid_color[1],centroid_color[2])) print type(centroid_color) cv2.fillpoly(im,cnt,centroid_color) i getting error on last line try , pass centroid_color color argument. <type 'numpy.ndarray'> , have been able pass data type cv2.fillpoly color in other instances, not sure why having problem here. fillpoly() expects iterable, i.e. put cnt in brackets. believe duplicate of https://stackoverflow.com/a/17582850/5818240 . moreover, centroid color variable contains strings. need convert them i
Read more