Question

.navbar容器上的高度，因为菜单不再是垂直的。 display:inline-block对我不起作用。必须有一个解决方案，而不给菜单一个填充来修复它。

如何将菜单垂直对齐到.navbar容器中？我使用bootstrap作为框架

<nav role="navigation" class="navbar navbar-default navbar-fixed-top">
<div class="container">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
        <button type="button" data-target="#navbarCollapse" data-toggle="collapse" class="navbar-toggle">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
        <a href="#" class="navbar-brand">Brand</a>
    </div>
    <!-- Collection of nav links and other content for toggling -->
    <div id="navbarCollapse" class="collapse navbar-collapse">
        <ul class="nav navbar-nav">
            <li class="active"><a href="#">Home</a></li>
            <li><a href="#">Profile</a></li>
            <li><a href="#">Messages</a></li>
        </ul>
        <ul class="nav navbar-nav navbar-right">
            <li><a href="#">Login</a></li>
        </ul>
    </div>
</div>

Jsfiddle

.navbar{background-image: linear-gradient(90deg, #bed970, #54c1b5);background-size: 100% 4px;background-position: 0 0;background-repeat: no-repeat;-webkit-box-shadow: 0 0 4px #c8cacc;box-shadow: 0 0 4px #c8cacc;border: none;font-size: 14px;min-height: 70px;}

Answer 1

问题似乎是.nav元素上的min-height被设置为70px

如果你添加以下css

while (true){
    WebElement button = null;
    try {
      button = driver.findElement(By.cssSelector("a[action='cancel']"));
    } catch (NoSuchElementException ex){
      break;   // button is missing, exit the loop
    }
    if (button.isDisplayed() == false) {
      break;   // button is hidden, exit the loop
    }

    driver.navigate().refresh();

    TimeUnit.SECONDS.sleep(5);
    driver.findElement(By.id("479510558845313")).sendKeys(InstagramAievx.spamusernameinput);

    driver.findElement(By.id("263795143794707")).sendKeys(InstagramAievx.spamcommentinput);

    driver.findElement(By.id("u_0_4")).sendKeys(x);
    driver.findElement(By.id("u_0_5")).click();
}

然后应该没问题

https://jsfiddle.net/ogvs98LL/

如果你想保持高度

，你可以在顶部添加填充

https://jsfiddle.net/pfjL9jy6/

Answer 2

假设您希望保持70px的高度，最简单的解决方案是根据上面的CodeRomeos注释更改行高。

 .navbar-brand, .navbar-nav li a {
 line-height: 40px;
}

https://jsfiddle.net/hnyadr4s/1/

在引导菜单中垂直对齐

2 个答案: