HTML/CSS, element position affected by zoom

  • Thread starter kolleamm
  • Start date
  • #1
442
40
I'm trying to make a simple HTML page that has a few elements. The problem is that when I zoom in using the mouse wheel and holding down Ctrl everything starts to go all over the place and it just looks completely mixed.
I tried to find solutions to this but have had no luck so far.

I want my page to have a proper zoom in and zoom out just like www.sephora dot com , or any other well designed website.

I've tried code such as position:absolute / relative, % values, px values, but no luck.

Thanks in advance
 

Answers and Replies

  • #2
Andrew Mason
Science Advisor
Homework Helper
7,671
393
Your position statements are the problem. If you want to use them you must first define an anchor point. Have a look at this little tutorial.

AM
 
  • #3
442
40
That does seem to be on the right track. The only problem I still have is that the page always zooms into the top left corner of the page, not towards the middle of the parent element. Even on this page everything remains in the middle until the elements cannot fit into the page anymore, then it zooms in towards the top left.
 
  • #4
442
40
Also my elements are still overlapping each other
 

Related Threads on HTML/CSS, element position affected by zoom

  • Last Post
Replies
17
Views
780
  • Last Post
Replies
11
Views
3K
  • Last Post
Replies
3
Views
59K
  • Last Post
Replies
19
Views
1K
  • Last Post
Replies
9
Views
825
Replies
4
Views
1K
  • Last Post
Replies
8
Views
743
Replies
1
Views
2K
  • Last Post
Replies
2
Views
1K
  • Last Post
Replies
18
Views
1K
Top