2016-06-13 3 views
0

Я знаю, что у них много подобных вопросов, но не из тех, которые исправили мою проблему. Как разместить изображение под другим с разрывом x px? Это мой кодКак разместить изображение под другим?

HTML

<img src="images/2.jpg" style="position:absolute;"> 
<img src="images/1.png" style="position:absolute;"> 

CSS

img { 
top: 50%; 
left: 50%; 
max-width: 480px; 
width: 100%; 
height: auto; 
transform: translate(-50%, -50%); 
display: block; 

} 

Редактировать: это моя проблема https://jsfiddle.net/50crfe10/ Как вы можете видеть, их 2 изображения, но только 1 появляются. потому что один над другим.

+0

Пожалуйста, дайте нам более подробную информацию, этот код не достаточно, чтобы понять данную проблему? –

+0

Хорошо, позвольте мне изменить свое сообщение. спасибо –

+0

Пожалуйста, проверьте этот [URL] (http://stackoverflow.com/help), будет полезно повысить качество контента до –

ответ

0

Просто удалить позицию: абсолютная, если ваш хорошо с ним, а также удалить преобразование свойство

img { 
 
\t max-width: 480px; 
 
\t width: 100%; 
 
\t height: auto; 
 
     display: block; 
 
     margin:20px auto; 
 
\t 
 
    }
<body> 
 
    <img class="one" src="https://scontent-sin.xx.fbcdn.net/v/t1.0-0/s480x480/13432215_784505675021945_898862369521210510_n.png?oh=1600b007c6bc56ad2a9e72c5978166b5&oe=5802FEB3"> 
 
    <img class="two" src="https://scontent-sin.xx.fbcdn.net/v/t1.0-9/13423946_783982808407565_3306592852780950589_n.png?oh=1131478aac319f301c563d020ed8214e&oe=57C2C4DE"> 
 
</body>

+0

, но я хочу изображение в середине:/ –

+0

просто добавьте margin: auto to img. –

+0

Работал, спасибо, последний вопрос. Как оставить пробел между двумя изображениями? –

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