Jump to content
  • 0

выравнивание сло?в по горизонтали


Kos87
 Share

Question

Не могу выровнять слои по горизонтали. Можно как то задать чтобы три колонки на сайте были по центру пространства или лучше , занимали весь родительский слой ? Пробовал выставить ширину в процентах, но что то оно то да не до конца ... Помогите пожалуйста!

Сайт:vermiculit.com.ua/test

Link to comment
Share on other sites

9 answers to this question

Recommended Posts

  • 0

в том примере всем слоям приписываеться клас *float:left у меня тоже это прописано. Вопрос немного в другом, как зделать так чтоб они динамически разтягивались? И еще одно, пробовал как в том примере вписать три свои таблички в

place1, place2, place3
так оно вообще опустило его вниз, есть подозрение что этот клирфлот рубит обтекание линий синих , справа и слева...
Link to comment
Share on other sites

  • 0

Дело в том что эти слои нада как то разместить по центру, в том плане чтобы отступ справа и слева был одинаковым, но при этом размер не ложен быть статическим. Я пока что поставил статический размер - 150px , пробовал ставить проценты , по 25% , но стремно оно как то ... в плане растягивания.

какие свойства дать родительскому слою ??

Link to comment
Share on other sites

  • 0

;) дело в том что я выставил ширину в процентах. А что даст маргин:авто? нужно дасть родителю свойство чтоб слои что находяться в нем позеционировались по центру...

и еще, когда я буду выставлять ширину тр?х столбцов в процентах, то 100% - это ширина родителя или ширину окна или предыдущего слоя?

Link to comment
Share on other sites

  • 0

Только что пробовал вписать то что вы предложили (я его добавиль в "инфо" после второго margin). Оно не разместило слои по центру , но убрало отступ от краев . Что дает значение "авто" ?

.info{margin-left:90px; margin-right:25px; text-align:justify; font-family:Arial, Helvetica, sans-serif; font-size:90%; color:#666666}
.place1, .place2, .place3{float:left; border-style:double; width:150px; margin:10px; padding:10px 20px 10px 20px}

Link to comment
Share on other sites

Guest
This topic is now closed to further replies.
 Share

  • Обсуждения

    • Актуальные контакты: Telegram: @Nikker_web E-Mail:   tarasevich.email@gmail.com Портфолио https://www.behance.net/d4d4186e Разрабатываю дизайн групп в соц сетях, сайтов, приложений, другой дизайн под заказ    
    • Актуальные контакты: Telegram: @Nikker_web E-Mail:   tarasevich.email@gmail.com   Разрабатываю дизайн групп в соц сетях, сайтов, приложений, другой дизайн под заказ   Портфолио https://www.behance.net/d4d4186e
    • Доброго всем времени суток. Прошу помощи. Научите принципу изменения футера. Движок Xenforo. Версия 2.2.10. Стиль дефолтный. Что именно нужно в итоге на фото примере. Мой шаблон app.footer less имеет следующее значение.  .p-footer { .xf-publicFooter(); a { .xf-publicFooterLink(); } } .p-footer-inner { .m-pageWidth(); .m-pageInset(); padding-top: @xf-paddingMedium; padding-bottom: @xf-paddingLarge; } .p-footer-row { .m-clearFix(); margin-bottom: -@xf-paddingLarge; } .p-footer-row-main { float: left; margin-bottom: @xf-paddingLarge; } .p-footer-row-opposite { float: right; margin-bottom: @xf-paddingLarge; } .p-footer-linkList { .m-listPlain(); .m-clearFix(); > li { float: left; margin-right: .5em; &:last-child { margin-right: 0; } a { padding: 2px 4px; border-radius: @xf-borderRadiusSmall; &:hover { text-decoration: none; background-color: fade(@xf-publicFooterLink--color, 10%); } } } } .p-footer-rssLink { > span { position: relative; top: -1px; display: inline-block; width: 1.44em; height: 1.44em; line-height: 1.44em; text-align: center; font-size: .8em; background-color: #4682B4; border-radius: 2px; } .fa-rss { color: white; } } .p-footer-copyright { margin-top: @xf-elementSpacer; text-align: center; font-size: @xf-fontSizeSmallest; } .p-footer-debug { margin-top: @xf-paddingLarge; text-align: right; font-size: @xf-fontSizeSmallest; .pairs > dt { color: inherit; } } @media (max-width: @xf-responsiveMedium) { .p-footer-row-main, .p-footer-row-opposite { float: none; } .p-footer-copyright { text-align: left; padding: 0 4px; // aligns with other links } }  
    • Нужны сайты с примерами верстки, типа https://css-tricks.com/. Типовые приемы и нестандартные на все случаи жизни. Накидайте ссылок.
×
×
  • 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