When zooming in or out on Chrome, the widths of elements increases very slightly and causes some elements to shift to the next line.<\/p>\n
The actual problem is Chrome adjusts the widths of elements by tenths.\u00a0 So something like 141px will turn into 141.1px which in turn causes all your elements to be just slightly bigger and not fit on one line.<\/p>\n
I thought the solution to this was to go through all the problem elements and re-set the size to the original size.\u00a0 However, it turns out you just have to go through the elements in javascript and Chrome will re-set the widths for you.\u00a0 This leads me to believe this width adjustment on zoom is a bug in Chrome.\u00a0 Below is what solved my problem in jQuery:<\/p>\n
\nvar menuItems = $(\"#navigation .menu a\");
\n$(window).resize(function() {
\nmenuItems.each(function(i, v){
\n\/\/by just going through the menu items it seems to fix the width rounding on zoom.
\n});
\n});
\n<\/code><\/p>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_genesis_hide_title":false,"_genesis_hide_breadcrumbs":false,"_genesis_hide_singular_image":false,"_genesis_hide_footer_widgets":false,"_genesis_custom_body_class":"","_genesis_custom_post_class":"","_genesis_layout":"","footnotes":""},"categories":[2],"tags":[14,41],"yoast_head":"\n