2015-02-01 6 views
0

В настоящее время у меня есть html-страница, которая должна создать div, который является полной шириной страницы. Я пытаюсь организовать divs внутри этой позиции в процентах, а не px. .question класс, связанный с DIV, который должен быть полная страницаПозиционирование элементов Div в процентах

мой CSS код выглядит следующим образом:

.question { 
     position: absolute; 
     min-height: 100%; 
     min-width: 100%; 
     } 

     #titlepage{ 
     position: relative; 
     top: 30%; 
     width: 50%; 
     text-align: center; 
     overflow: auto; 
     margin-left: auto; 
     margin-right: auto; 
     } 

     html, body { 
     background-color: #A0B8C8; 
     height:100%; 
     width:100%; 
     } 

<body ontouchmove="BlockMove(event);"> 
     <div class="question"> 
     <div id="titlepage"> 
      <h1> test data </h1> 
     </div> 
     </div> 

Цель состоит в #titlepage дел до 30% размера экрана от сверху и по центру.

В данный момент это 30% сверху, но маржа auto не устанавливает его по горизонтали.

Любая помощь приветствуется, а также объяснение почему.

Спасибо

* Редактировать html добавлен. Похоже, он не работает с моей. Возможно ли, что что-то его переопределяет?

** Редактировать. Кажется, я исправил это, добавив право: 0; Слева направо: 0; так это выглядит следующим образом:

.titlepage{ 
    position: absolute; 
    top: 30%; 
    width: 50%; 
    text-align: center; 
    margin: 0 auto; 
    right: 0; left: 0;  
    } 

Может кто-нибудь объяснить, почему?

+0

Не могли бы вы также разместить свой HTML-код? –

+0

Вам также нужно показать свой HTML. – cli

+0

http://jsbin.com/wuyuqetefe/1/edit Кажется, работает, как вы описали? – Linus

ответ

0

Изменить

top: 30%; 

Для

height: 30% 

Я надеюсь, что это то, что вы просите.

+0

Я хочу переместить div, а не масштабировать его. Расположение его просто не центрировано по горизонтали –

Смежные вопросы