html - 我在手机上的导航被推到两行，但在桌面上它很好

Question

所以我有一个网站：

http://joekilgallon.com/

桌面上的一切看起来都很好，但在我的 iphone 上，导航推到了两行。我知道这与这些链接的 CSS 上的填充有关，但我尝试更改它，但如果不弄乱桌面视图，则没有任何效果。谁能帮我弄清楚如何仅更改移动视图或如何调整我的 CSS 以使导航仅在一行上。

Answer 1

使用一些媒体查询怎么样！您可以在其中使用特定 css 定位某些屏幕尺寸！看看这里！

/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
/* Styles */
}

/* Smartphones (landscape) ----------- */
@media only screen 
and (min-width : 321px) {
/* Styles */
}

/* Smartphones (portrait) ----------- */
@media only screen 
and (max-width : 320px) {
/* Styles */
}