[英]Can I avoid float elements shifting when I resize my browser?
I am new to the world of coding as well as CSS and have noticed that when I resize my browser, all my float elements move to say the right and the user is forced to scroll horizontally to view say the menu.我是编码世界的新手以及 CSS 并且注意到当我调整浏览器大小时,我所有的浮动元素都会向右移动,并且用户被迫水平滚动以查看菜单。
Firstly is there a need to prevent float elements not changing their position?首先,是否需要防止浮动元素不改变其 position?
Secondly, is there a way I can avoid this if I should be preventing it?其次,如果我应该阻止它,有没有办法可以避免这种情况?
Floats are a pain in the butt.浮动是一个痛苦的屁股。 Primarily because of the one browser that refuses to follow the universal web standards.主要是因为一个浏览器拒绝遵循通用的 web 标准。 Yeah, that one.是的,那个。
There are a million and one tricks to avoid these problems.有一百万零一个技巧可以避免这些问题。 I tell my team to follow these steps:我告诉我的团队遵循以下步骤:
I'd suggest you figure out if you want to support differing resolutions, depending on your target audience.我建议您确定是否要支持不同的分辨率,具体取决于您的目标受众。 Elements moving around isn't necessarily a bad thing, and planning in advance how you want your site to layout depending on viewport size could be important.元素四处移动不一定是坏事,根据视口大小提前计划您希望站点如何布局可能很重要。
If you can't find a fixed-width, "one layout to rule them all" that works for your needs, take a look at CSS media queries .如果您找不到适合您需要的固定宽度的“一个布局来统治所有这些”,请查看CSS 媒体查询。 For a more practical article on them, try A List Apart有关它们的更实用的文章,请尝试A List Apart
The basic idea is that, using separate stylesheets that depend on size, you can basically display a different layout to the user depending on their viewport.基本思想是,使用取决于大小的单独样式表,您基本上可以根据用户的视口向用户显示不同的布局。 Users resizing their browsers will be able to see the new layout dynamically as well.调整浏览器大小的用户也将能够动态地看到新布局。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.