Поля не работают?

У меня есть div, «top» внутри «theform», который я хочу центрировать, и 2em для верхнего поля. Он центрируется, но не является 2em для верхней границы. И -webkit-box-align: center; не работает ни потому, что мне нужно «mainphoto» в центре.Поля не работают?

Любые идеи? Возможно, крах рухнул? Я не мог найти исправления, если это так.

http://jsfiddle.net/D2BC4/1/

HTML

<div id="wrapper"> 
     <body> 
     <?php 
     ?> 
     <div id="theform"> 
      <form> 
       <div id="top"> 
        <div id="mainphoto"> 

        </div> 
        <div id="title"> 

        </div> 
       </div> 
      </form> 
     </div> 
     </body> 
    </div>

CSS

*{ 
    font-size:100%; 
    margin: 0em; 
    padding: 0em; 
} 

body{ 
    width: 100%; 
} 

#mainphoto{ 
    display:-webkit-box; 
    width:22em; 
    height:17em; 
    border:1px solid red; 
} 


#theform{ 
    display:-webkit-box; 
    -webkit-box-orient: vertical; 
    width: 55em; 
    overflow:auto; 
    border:1px black solid; 
} 

#title{ 
    display:-webkit-box; 
} 

#top{ 
    -webkit-box-orient: horizontal; 
    -webkit-box-align: center; 
    margin: 2em auto; 
    width: 50em; 
    height:20em; 
    overflow:auto; 
    border:2px red solid; 
} 



#wrapper{ 
    display:-webkit-box; 
    -webkit-box-orient: horizontal; 
    -webkit-border-radius:0.9em; 
    box-shadow: 3px 10px 5px #888888; 
    margin: 3em auto; 
    width: 80em; 
    height:52em; 
}

источник

2013-04-01 user2127833

Убедитесь, что вы никогда не использовать свойства Flexbox 2009 без предоставления свойств от стандартной спецификации: http://www.w3.org/TR/css3-flexbox/ , Вы никогда не знаете, когда браузеры откажутся от поддержки свойств из этого старого черновика. – cimmanon

@cimmanon спасибо, но знаете ли вы ответ на мою проблему? – user2127833

То, что вы ищете, неясно. В центре? Горизонтальный? Вертикальный? У вас есть много элементов, которые были превращены в * гибкие контейнеры * без каких-либо причин. Вы используете свойства, которые работают только с гибкими контейнерами на элементах, которые не являются гибкими контейнерами. У вас есть 'div', содержащий твой тег body, который является недопустимым HTML. – cimmanon

добавить запас к вашему #mainphoto, чтобы сделать его центр

#mainphoto{ 
    display:-webkit-box; 
    width:22em; 
    height:17em; 
    margin:2em auto 0 auto; 
}

работает demo

надежду, что эта помощь

источник

2013-04-01 01:38:16 jhunlio

Я хочу, чтобы он был выровнен с выровненным по ящику. И не по центру. Я хочу, чтобы div «top» был центрирован и имел верхний край 2em – user2127833

вы главный '# top' должен быть' center', '# mainphoto' должен находиться в левом углу' # top', можете ли вы показать мне изображение, о том, чего вы хотите достичь, если вы с ним согласны. – jhunlio

Поля не работают?

ответ

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