HTML, как сохранить объект в том же месте

Question

У меня есть html-страница, и у меня есть таблица внутри этой страницы. Я пытаюсь разместить его на определенном расстоянии посередине. (У меня есть небольшое инопланетное существо в качестве фонового изображения, которое выглядит так, будто он держит эту таблицу). Я использовал абсолютное позиционирование и сделал, например:

Вверх: 20% и справа: 10%.

Когда я загружаю веб-страницу, он находится в одном месте на одном мониторе, а затем, когда я использую больший монитор, стол находится в другом месте. Как я могу предотвратить это, так что независимо от того, насколько большой монитор; стол по-прежнему находится в одном месте, несмотря ни на что? На моей веб-странице нет полос прокрутки, поэтому все на одном дисплее без необходимости прокрутки. Может быть, мне нужно использовать относительное или статическое или фиксированное позиционирование? Я не знаю Спасибо за помощь.

<table style="position: absolute; top:20%; right:10%" width=60% border="1"> 

Answer 1

Вы должны использовать фактические значения пикселей. Поскольку вы используете проценты, он будет меняться в зависимости от размера экрана. Также сделайте это относительно левого края, а не справа, если ваше изображение, которое вы пытаетесь выровнять, плавает вправо.

ли что-то вроде:

<table style="position: absolute; top:50px; left:100px" width=100px border="1"> 

Answer 2

Вы можете использовать медиа-запрос для различного разрешения. Проверьте это http://css-tricks.com/resolution-specific-stylesheets/