导航栏中的垂直对齐文本[关闭]答案

【问题标题】：Vertical-align text within a nav bar [closed]导航栏中的垂直对齐文本[关闭]
【发布时间】：2015-11-10 23:53:25
【问题描述】：

编辑：问题已解决

我无法将右侧的两个菜单选项与左侧的主 heading 垂直对齐。我希望两行文本的底部彼此齐平。

jsfiddle：

像这样：

此刻他们是这样坐着的：

【问题讨论】：

你想要'spray city'下的'interact'和'photo'作为列表吗？
请把你的观点说清楚，这样我们就不会把你的问题看了3遍，还是不明白
寻求调试帮助的问题（“为什么这段代码不起作用？”）必须在问题本身中包含所需的行为、特定问题或错误以及重现它所需的最短代码 . 注意 - 请不要滥用代码块来绕过此要求。
嗨伙计们，抱歉问题不清楚，我希望导航栏中所有文本的底部对齐，而不是当前对齐 - 两个菜单的底部右侧的选项高于左侧标题的底部。（图片与右侧选项之间的间距大于图片与左侧标题之间的间距）。

【解决方案1】：

提供* {box-sizing: border-box;} 可以解决您的问题：

或者，如果您不想按照klaar 的建议将其分配给所有元素，您可以这样做：

img {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

注意：这是不正确使用width 和盒子模型属性的问题。您需要谨慎选择这些。

这将是一个了解盒子模型如何工作的小插图：

_{（来源：teamtreehouse.com）}

【讨论】：