垂直对齐li元素中间的div

时间：2016-06-02 17:51:08

标签： html css html-lists vertical-alignment

我迷失了div，li和ul。我无法在表单输入的中间垂直对齐单词EN。

以下是演示： https://jsfiddle.net/z9qjcv2k/

我尝试使用height和line-height，它应该具有相同的高度，我无法让它工作。

谢谢大家。

HTML：

<div class='line'>
  <div class='content_line'>
    <ul class='alignes'>
      <li>
        <div class='menu'>
        <ul class='menu'>
            <li class='menu'><a href='index.php?langue=en'>EN</a></li>
        </ul>
        </div>
       </li>
       <li><input type=text name=mots size=50 placeholder='Search...'></li>
       </ul>
 </div>

CSS：

*{
  margin:0;
}

.line{
height:100px;
background-color:#1b1b1b;
text-align:center;
border-top:1px solid #444444;
border-bottom:1px solid #444444;
padding-left:5%;
}

.alignes ul{


list-style-type:none;
}


.alignes li{
  display: inline;
    height: 233px;
    line-height: 233px;
color:#aaa8a9;
position:relative;
top:20px;
  height: 233px;
    line-height: 233:px;


}

.content_line{
padding-left:15%;
}








.menu{
display:inline important!;
float:left;


}

.menu ul {
 margin:0;
 padding:0;
 list-style-type:none;
 text-align:center;
 }
.menu li {
 float:left;
 margin:auto;
 padding:0;
line-height:10px;
height:10px;
}
.menu li a {
 display:block;
 width:100px;
 color:red;
line-height:233px;
height:233px;
 text-decoration:none;
 padding:5px;
 }
.menu li a:hover {
 color:#FFD700;
 }  
.menu ul li ul {
 display:none;
 }

.menu ul li:hover ul {
 display:block;
 }
.menu li:hover ul li {
 float:none;
 }
.menu li ul {
 position:absolute;
 }

1 个答案:

答案 0 :(得分：0)

重新定义.menu类浮动

                ||=== Clean: Debug in nettest (compiler: GNU GCC Compiler) ===|
                ||=== Build: Debug in nettest (compiler: GNU GCC Compiler) ===|
                U:\Main\Code\nettest\main.cpp||In function 'int main()':|
                U:\Main\Code\nettest\main.cpp|5|warning: unused variable 'result' [-Wunused-variable]|
                U:\Main\Code\nettest\main.cpp|7|warning: variable 'res' set but not used [-Wunused-but-set-variable]|
                U:\Main\Code\Libs\curl\lib\libcurl.a(easy.o)|| undefined reference to `WSAStartup@8'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(easy.o)|| undefined reference to `WSACleanup@0'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(easy.o)|| undefined reference to `WSACleanup@0'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(select.o)|| undefined reference to `WSASetLastError@4'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(select.o)|| undefined reference to `select@20'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(select.o)|| undefined reference to `WSAGetLastError@0'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(select.o)|| undefined reference to `__WSAFDIsSet@8'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(select.o)|| undefined reference to `__WSAFDIsSet@8'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(select.o)|| undefined reference to `__WSAFDIsSet@8'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(select.o)|| undefined reference to `__WSAFDIsSet@8'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(select.o)|| undefined reference to `__WSAFDIsSet@8'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(select.o)|| more undefined references to `__WSAFDIsSet@8' follow|
                U:\Main\Code\Libs\curl\lib\libcurl.a(select.o)|| undefined reference to `select@20'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(select.o)|| undefined reference to `WSAGetLastError@0'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(select.o)|| undefined reference to `__WSAFDIsSet@8'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(select.o)|| undefined reference to `__WSAFDIsSet@8'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(select.o)|| undefined reference to `__WSAFDIsSet@8'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(asyn-thread.o)|| undefined reference to `WSAGetLastError@0'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(url.o):(.text.unlikely+0x265)||undefined reference to `idna_to_ascii_lz'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(url.o):(.text.unlikely+0x26c)||undefined reference to `stringprep_locale_charset'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(url.o):(.text.unlikely+0x2d8)||undefined reference to `idna_to_unicode_lzlz'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(url.o):(.text.unlikely+0x2fc)||undefined reference to `tld_check_lz'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(url.o):(.text.unlikely+0x382)||undefined reference to `stringprep_check_version'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(sendf.o)|| undefined reference to `recv@16'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(sendf.o)|| undefined reference to `WSAGetLastError@0'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(sendf.o)|| undefined reference to `recv@16'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(sendf.o)|| undefined reference to `WSAGetLastError@0'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(sendf.o)|| undefined reference to `send@16'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(sendf.o)|| undefined reference to `WSAGetLastError@0'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(connect.o)|| undefined reference to `getsockopt@20'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(connect.o)|| undefined reference to `WSAGetLastError@0'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(connect.o)|| undefined reference to `ntohs@4'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(connect.o)|| undefined reference to `getpeername@12'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(connect.o)|| undefined reference to `WSAGetLastError@0'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(connect.o)|| undefined reference to `getsockname@12'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(connect.o)|| undefined reference to `WSAGetLastError@0'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(connect.o)|| undefined reference to `getsockopt@20'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(connect.o)|| undefined reference to `setsockopt@20'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(connect.o)|| undefined reference to `recv@16'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(connect.o)|| undefined reference to `closesocket@4'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(connect.o)|| undefined reference to `socket@12'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(connect.o)|| undefined reference to `setsockopt@20'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(connect.o)|| undefined reference to `WSAIoctl@36'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(connect.o)|| undefined reference to `WSAGetLastError@0'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(connect.o)|| undefined reference to `bind@12'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(connect.o)|| undefined reference to `ntohs@4'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(connect.o)|| undefined reference to `htons@4'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(connect.o)|| undefined reference to `setsockopt@20'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(connect.o)|| undefined reference to `getsockname@12'|
                U:\Main\Code\Libs\curl\lib\libcurl.a(connect.o)|| undefined reference to `WSAGetLastError@0'|
                ||More errors follow but not being shown.|
                ||Edit the max errors limit in compiler options...|
                ||=== Build failed: 50 error(s), 2 warning(s) (0 minute(s), 3 second(s)) ===|

并设置适当的填充到.menu li a 

  .menu {
   .....
   float: none;
  }
相关问题
最新问题