Zurb基金会5 - topbar搜索

您是否遇到过zurb基金会的topbar问题？ that 输入框不适合导航。我没有修改任何东西，只是将foundation's page的代码粘贴到基础文件中包含的示例网站。将字体更改为Open Sans也无济于事。Zurb基金会5 - topbar搜索

来源

2013-11-24 knapcio

你必须显示一些代码，如果你想得到这个帮助。据我所知，你显然缺少一些东西，如果你真的只是复制和粘贴，那么搜索框的位置就会不同。 – Karl

对不起，代码是[here]（http://pastebin.com/2si3ebwp）。 – knapcio

对于初学者，.top-bar input的基金会造型被更具体的input[type="text"]的造型所覆盖。但是，即使添加了type属性，5.0.2版本中的样式与示例中的样式稍有不同。

要模仿的例子中的造型，添加以下到您自己的自定义样式表，这应该foundation.css后添加：

.top-bar input[type="text"], .top-bar .button { 
    font-size: 0.77778rem; 
    position: relative; 
    top: 7px; 
} 

.top-bar input[type="text"] { 
    height: auto; 
    padding-top: 0.35rem; 
    padding-bottom: 0.35rem; 
    font-size: 0.75rem; 
}

编辑：新增的jsfiddle：http://jsfiddle.net/4vRNt/2/

来源

2013-11-25 15:14:17 chrisjsherm

谢谢，它或多或少的帮助输入。但我发生下一个问题，当我放大浏览器的窗口导航完全打破像[that]（http://imgur.com/bEXBhVw） – knapcio

您可以看到它在我上面添加的JSFiddle工作。检查你的代码。 – chrisjsherm

Zurb基金会5 - topbar搜索

回答

相关问题