wordpress - Wordpress Bootsrap 菜单 - 在较小的响应视图中将搜索框向左对齐？

Question

网站网址：http ://scc.maxworks.org/wo-wp0001/

我需要将搜索框放入网站顶部的导航菜单中，我这样做了（它是无序列表中的一个 div），并且它在计算机屏幕上放置在我想要的位置。现在我正试图让它在平板电脑或手机上表现得像我想的那样——当你点击菜单图标打开列表时，我想对齐到屏幕的左侧。（实际上我希望搜索框出现在菜单图标旁边，但我认为这超出了我目前的能力。所以我试图在较小的视图中将其对齐到左侧。

我正在使用引导程序。

Answer 1

在 bootstrapwp.css 中找到

ul#main-menu.nav li form#searchform div {
  display: block;
  overflow: hidden;
  padding: 0 0 0 380px;
}

删除填充

ul#main-menu.nav li form#searchform div {
  display: block;
  overflow: hidden;
}

Answer 2

我想你想看看这个。您可以使用响应式实用程序类。因此，放入 2 个搜索框并隐藏不需要的分辨率。可能不是超级超级最好的方法，但它有效并且很快。

可能有一些花哨的 js 方法来完成这个，不能帮助你。