2014-02-09 2 views
-2

как я могу выровнять центр этих блоков fiddle?как выровнять центральный div с отображением блока?

дисплей представляет собой блок, потому что имеют ширину и высоту, и теперь я не могу выравнивание по центру страницы этой метки HTML:

<div style="position:relative;top:30px;"> 
    <a href="#events" class="scroll submit">abcdefghijk</a> 
    <a href="#" class="submit">abcde</a> 
    <a href="#" class="submit">abc</a> 
</div> 

Update: Я думал, я должен использовать left:50% для Align центром а ДИВ

CSS:

.submit { 
    background-clip: padding-box; 
    background-color: #CD1D27; 
    border-radius: 9px/10px; 
    color: #FFFFFF; 
    font-family: Francois One,sans-serif; 
    height: 46px; 
    padding: 8px 30px; 
    width: 153px; 
    display:block; 
    float:right; 
} 

ответ

2

Добавить text-align в контейнере:

<div style="position:relative;top:30px;text-align:center;display:block;"> 
    <a href="#events" class="scroll submit">abcdefghijk</a> 
    <a href="#" class="submit">abcde</a> 
    <a href="#" class="submit">abc</a> 
</div> 

Updated fiddle.

+1

, но мне нужно дисплей: блок –

+1

@Mohammad Что вы имеете в виду вы хотите 'дисплей: блок;'? Вы используете 'div', который является элементом уровня * block * по умолчанию –

+0

Вы можете ввести его там, это не влияет на макет: http://jsfiddle.net/c62PB/17/ – aksu

0

еще одно решение,

<div style="position:relative;top:30px; display: table; margin: 0 auto;"> 
    <a href="#events" class="scroll submit">abcdefghijk</a> 
    <a href="#" class="submit">abcde</a> 
    <a href="#" class="submit">abc</a> 
</div> 
0

эй мой друг использовать этот

 

    .submit{ 
    position:absolute; 
    width:300px; 
    height:200px; 
    z-index:15; 
    top:50%; 
    left:50%; 
    margin:-100px 0 0 -150px; 
    background:red; 
} 
0

Вы можете использовать position:absolute;top:0;left:0;bottom:0;right:0;margin:auto; горизонтально выровнять DIV при условии у вас есть фиксированная ширина. если вы хотите вертикально выровнять div в центре, вам также нужно установить высоту div.

Например

<div style="position:absolute;top:0;left:0;bottom:0;right:0;margin:1em auto 0 auto;width:340px"> 
     <a href="#events" class="scroll submit">abcdefghijk</a> 
    <a href="#" class="submit">abcde</a> 
    <a href="#" class="submit">abc</a> 
</div> 
Смежные вопросы