无法居中徽标图像在div中垂直 [英] Cannot center Logo Image Vertically in a div
本文介绍了无法居中徽标图像在div中垂直的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
在这种情况下，如何在世界中将图像垂直放置在div内。它不会ont预算，无论我多么努力。你能帮忙吗？
How in the world do I center an Image vertically inside a div in this case. It wont budge no matter how much I try. Can you help?
<!DOCTYPE html>
<html>
<head>
<title> New Document </title>
<link rel="stylesheet" href="http://onr.com/css/nav.css" type="text/css" media="screen">
</head>
<body>
<header>
<div class="cont">
<div class="logo">
<img src="/css/logo.png">
</div>
<div class="me">
<ul>
<li><a href="/">Sign In</a></li>
<li><a href="/">|</a></li>
<li><a href="/">Sign Up</a></li>
</ul>
</div>
</div>
</body>
</html>
CSS
body {
color: #333333;
font-family: "proxima-nova",sans-serif;
font-weight: 300;
}
.cont{
background: none repeat scroll 0 0 #34495E;
height:50px;
}
.me {
float:right;
}
.me ul {
float:right;
list-style: none outside none;
}
.me li {
float:left;
padding-right: 15px;
text-decoration:none;
}
.me li a{
color: rgba(255, 255, 255, 0.6);
text-decoration:none;
}
.me li a:hover{
color: #ffffff;
}
.logo {
float:left;
vertical-align: middle;
display: table-cell;
}
.logo img {
display: block; margin: auto ;
}
图片图片在这里， 。
>
推荐答案
它有用吗？我更改了某些区域演示
Is it useful? I have changed some area Demo
html
html
<div class="logo">
<span><img src="http://placehold.it/50x10"></span>
</div>
.logo{
float:left;
}
.logo span{
height:50px;
vertical-align: middle;
display: table-cell;
}
.logo img {
}
这篇关于无法居中徽标图像在div中垂直的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
