Divs move when zooming out. How do i use percentages when I have uneven number?

StackOverflow https://stackoverflow.com/questions/22106405

  •  18-10-2022
  •  | 
  •  

Question

I'm trying to create a menu bar, but somehow, when zooming out my last button always goes out of the menu. But it doesn't stay there. Does anyone have an idea? 

<div id="tip"></div>
<div id="top">
<div id="menu">
    <div class="menuButton"></div>
    <div class="menuButton"></div>
    <div class="menuButton"></div>
    <div class="menuButton"></div>
    <div class="menuButton"></div>
    <div class="menuButton"></div>
    <div class="menuButton2"></div>
</div>
 </div>
 </body>
 </html>

The HTML. The CSS is in the fiddle below.

http://jsfiddle.net/Legruan/f7nzu/

I made this fiddle with the code in it so far. Thanks in advance!

No correct solution

OTHER TIPS

maybe try to use vieuwport ? this is how i fixed a problem like this

<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
</head>
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top