Posted 16 мая, 20178 yr Здравствуйте. Имеются два блока: красный и синий. Изначально, синий блок находится под красным. <!DOCTYPE HTML> <html> <head> <title>TEST</title> </head> <body> <style> #block1, #block2 { display: block; width: 200px; height: 200px; } #block1 { background: red; } #block2 { background: blue; } </style> <div id="block1"></div> <div id="block2"></div> </body> </html> Мне нужно сделать так, чтобы нижний синий блок был справа от красного вверху, т.е. они должны быть вместе по горизонтали. Я сделал так: <!DOCTYPE HTML> <html> <head> <title>TEST</title> </head> <body> <style> #block1, #block2 { display: block; width: 200px; height: 200px; } #block1 { background: red; margin-bottom: -200px; } #block2 { background: blue; margin-left: 200px; } </style> <div id="block1"></div> <div id="block2"></div> </body> </html> Вопрос: Есть ли способ сделать это(разместить блоки (div) рядом по горизонтали) легче с помощью html или css ?
16 мая, 20178 yr 35 минут назад, maxaent сказал: легче с помощью html или css ? Попробуйте только через HTMLЯ так просто не умею. Интересно просто. PS Конечно же через css
16 мая, 20178 yr Через css <!DOCTYPE HTML> <html> <head> <title>TEST</title> </head> <body> <style> .block1 { padding: 5px; float: left; width: 200px; } .block2 { padding: 5px; float: left; width: 200px; } </style> <div class="block1"> Текст 111111 </div> <div class="block2"> Текст 22222 </div> </body> </html>
17 мая, 20178 yr Author 18 часов назад, jack007 сказал: Через css <!DOCTYPE HTML> <html> <head> <title>TEST</title> </head> <body> <style> .block1 { padding: 5px; float: left; width: 200px; } .block2 { padding: 5px; float: left; width: 200px; } </style> <div class="block1"> Текст 111111 </div> <div class="block2"> Текст 22222 </div> </body> </html> Тоже так пробовал, не получалось, я просто ставил только для 1го блока float, не знал, что для обоих надо обтекание ставить.
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.