Jump to content

booster

Newbie
  • Posts

    3
  • Joined

  • Last visited

Everything posted by booster

  1. Получилось то что нужно, но какой-то велосипед.. Это нормальное решение? Можно как-то проще это реализовать? <html> <head> <style> div { display: inline-block; vertical-align: top;} .w1 { width: 50px; } .w3 { width: 160px; } .h { height: 105px; } .w5 { width: 270px; } img { width: 100%; } .block { display: block; } .up { margin-top: -50px; } .r { float: right; } .down { margin-bottom: 5px; } </style> </head> <body> <div class="w5 block down"> <div class="w1"><img src="404" /></div> <div class="w3 h"><img class="h" src="404" /></div> <div class="w1"><img src="404" /></div> <div class="w1 up"><img src="404" /></div> <div class="w1 up r"><img src="404" /></div> </div> <div class="w5 block"> <div class="w1"><img src="404" /></div> <div class="w1"><img src="404" /></div> <div class="w1"><img src="404" /></div> <div class="w1"><img src="404" /></div> <div class="w1"><img src="404" /></div> </div> </body></html>
  2. Как тут достичь нужного эффекта? Еще пробовал через float, но максимум, что получается это два элемента слева, большой в центре и один справа, второй "справа" оказывается строкой ниже. (вторую строку в расчет не беру, там все понятно) <html> <head> <style> div { display: inline-block; vertical-align: top;} .w1 { width: 50px } .w3 { width: 160px } .w5 { width: 270px; } img { width: 100%; } .block { display: block; } </style> </head> <body> <div class="w5 block"> <div class="w1"><img src="404" /></div> <div class="w3"><img src="404" style="height: 100px;" /></div> <div class="w1"><img src="404" /></div> <div class="w1"><img src="404" /></div> <div class="w1"><img src="404" /></div> </div> <div class="w5 block"> <div class="w1"><img src="404" /></div> <div class="w1"><img src="404" /></div> <div class="w1"><img src="404" /></div> <div class="w1"><img src="404" /></div> <div class="w1"><img src="404" /></div> </div> </body></html>
  3. Доброго времени суток! Подскажите как можно сверстать такое отображение блоков? Пробовал через свойства float, но ничего не вышло. Максимум что получается это один маленький блок слева, большой по центру и 2 справа + ниже 5 блоков.
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy