我得到了以下简单的 HTML 代码:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="estilos.css">
</head>
<body>
<div id="bar">
<span>
Palavra
</span>
<form>
<input class="buttom" type="submit" value="">
</form>
</div>
</body>
</html>
我的 CSS 代码是这样的:
#bar{
width:100%;
height:7%;
background-color:#5959AB;
color:white;
font-family:"Arial";
font-size:150%;
font-weight: bold;
line-height: 190%;
}
.buttom{
background: url(icone_dicionario.jpg) no-repeat;
cursor: pointer;
width: 40px;
height: 41px;
}
input{
position:relative;
bottom:1000%;
left:13%;
}
html, body{
height:100%;
}
看看 CSS 上的 input
样式。它代表的元素(字典图标中的一个按钮)服从我给它的水平位置(“left: 13%
”),但不是垂直位置(不管我输入的值如何它),如您所见:
谁能帮帮我?
PS:我希望按钮出现在栏内,除了那个词......
最佳答案
JSFiddle
只需将属性 top: -40px; 添加到 input 样式。 因为输入的宽度是固定的。
input{
position:relative;
bottom:1000%;
left:13%;
top:-40px;
}
关于html - CSS:无法垂直移动我的按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27095211/