Выстроить блоки в круг

[OLGANICHIC]

Задача: в одном блоке расположить 3 штуки или больше по кругу или по треугольнику острием вниз. В блоках информация от постов, 

код

<div class="my-blok">        <div class="1">                                                    <div class="2">                              <div class="3" style="background: none center center no-repeat !important;"> <a href="<?php the_permalink(); ?>"><img src="<?php echo $src[0]; ?>" alt="" onmouseover="this.src='<?php echo nimble_portfolio_get_meta(''); ?>'" onmouseout="this.src='<?php echo $src[0]; ?>'" />                                                   </a>  </div>                  </div>                           </div>                            </div> 

    

 

Какое свойство css задать для блока my-blok ? 

 

Сейчас он охватывает все другое по типу

.my-blok {    width:1200px;    height:auto;    display:block;    }

Edited November 25, 2013 by alexriz
Оформляйте код в тег CODE

[OLGANICHIC]

Хорошо, а если бы это были картинки? Т.е. кружок, а в нем по краю круга картиночки.... Помогите, кто чм может

[swandev]

Никогда! не используйте инлайн стили и скрипты тоже, это плохо.

 

Выложите ваш код на jsbin.com

 

 

[OLGANICHIC]

http://jsbin.com/OkixuMOz/1/edit

[Great Rash]

http://codepen.io/Jabher/pen/IyDAp

Статья на хабре.

[OLGANICHIC]

спасибо

[swandev]

http://codepen.io/Jabher/pen/IyDAp

Статья на хабре.

Вот она мощь препроцессоров) 26 строк превратились  в почти 500

[Great Rash]

Это демонстрация ущербности CSS и HTML.

[SelenIT]

Префикснутые строки можно не считать. Особенно -moz- и -o-transform, актуальные сегодня разве что для археологов-маньяков. И не обязательно учитывать все мыслимые комбинации до 10 элементов. И .child:nth-child(1):nth-last-child(0) { -какая-то-transform: translate(-50%, -100%) rotate(NaNdeg); }, конечно, артефакт. Но в целом да — без явного перечисления комбинаций пока никак...

[OLGANICHIC]

Может и артефакт, но задачу свою выполнило отлично. Теперь бы изображение внутри блоков расположить попой вниз, а не во все стороны. )))

[Great Rash]

Поверните изображение в противоположную сторону.

[SelenIT]

Добавить еще один трансформ. Как-то так

[OLGANICHIC]

Всем спасибо, все получилось. Вопрос закрыт