маржа не работает на всех

Я хочу поставить h1 только около 3 пикселей пыльник класса кнопки, но это не похоже на работу, даже если я ставлю:маржа не работает на всех

margin-top:-10px;

Вот предварительный просмотр: http://jsfiddle.net/poyf59jv/

Любые идеи?

источник

2015-02-09 Scarlett Lucĭa

Вы не можете использовать отрицательный запас на инлайн-блочного элемента. Вы можете использовать position: relative, но ваш метод кажется неправильным, попробуйте сгруппировать заголовок, а заголовок каждого элемента будет более семантическим и легким. – tomtomtom

Вы должны обернуть все элементы, которые принадлежат друг другу внутри одного элемента. – Michelangelo

Вы должны обернуть якорные метки в тегах div и h1 в другом div, а затем сделать margin-bottom: -5px, например, первому div.

jsfiddle обновлен.

источник

2015-02-09 14:48:13 animake

Добавление отступов вместо поля по мере необходимости.

источник

2015-02-09 14:36:50 Kumar

Вот пример того, что вы хотите: http://jsfiddle.net/poyf59jv/3/

<div id="buttons"> 
    <span><a class="buttons" id="tab1" href="#">Home</a><h1>Homepage</h1></span> 
    <span><a class="buttons" id="tab2" href="#">About</a><h1>About</h1></span> 
</div> 

#buttons{ 
position:absolute; 
top:225px; 
height:40px; 
width:850px; 
margin-left:30px; 

} 

.buttons{ 
display: inline-block; 
width: 122px; 
line-height:1px; 
margin-right:6px; 
text-align: center; 
padding-right:5px; 
padding-left:5px; 
color: black; 
font-family: lobster; 
font-size: 18px; 
font-weight: bold; 
font-style: normal; 
text-shadow: #000000 0px 0px 0.7px; 
text-decoration:none !important; 
text-decoration:none; 
letter-spacing:-0.1px; 
} 

span { 
    width: 200px; 
    display:inline-block; 
    text-align:center; 
} 

span h1 { 
    position:relative; 
    margin-top: -10px; 
    padding: 0; 
}

источник

2015-02-09 14:50:38 Michelangelo

маржа не работает на всех

ответ

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