- 0
-
Similar Content
-
By Nerwoid
Ребят всем привет! Я только начал изучать верстку по видео урокам на ютубе. У меня есть свой макет который я купил у дизайнера. Решил с него поучиться верстать. Подскажите как правильно сделать шапку сайта. У меня все выравнивания происходят с помощь отрицательных "margin". Судя по урокам, везде делают это с помощью flex и тому подобное. Дизайн очень оказался сложным и там много проблем с фонами. Дайте пару советов и подсказок как продолжать дальше. Заранее спасибо ?
Вот: макет:
Мой сайт
-
By AlexProf
Не получается разобраться, как работает свойство vertical-align. В таблицах работает, а для строчных элементов почему-то нет. Пытаюсь сделать вертикальное выравнивание, но текст не сдвигается
<div style="height: 200px"><span style="vertical-align: middle">Текст</span></div> Как правильно устанавливать это свойство?
-
By Raiz
Добрый день!
Может кто нибудь объяснить мне, не смышленому верстальщику-новичку, как мне выравнить текст по центру картинок?
Я уже все перепробывал,но что то не клеится((
на первом скрине я отразил суть проблемы, а на втором то, как это должно быть по макету!
(я заменил одну картинку, т.к. это не особо важно, но сути это не меняет)
в html я объединил это все (картинки\текст) в один див и дал ему класс.
далее я дал класс всем текстовым материалам и ид для каждой картинки, дабы сделать более гибкую настройку, но все пошло не по плану.
в CSS класс текста выглядит так:
.contenttext { display: inline-block; font-family: 'Raleway', Arial, sans-serif; margin-top: 60px; font-weight: 500; font-size: 130%; } Видимо задавать margin-top: 60px; вообще лишнее, по скольку вместе с текстом перемещаются и картинки. Парюсь уже битый час над этим.
Если кто сможет, подскажите, что можно предпринять для разрешения проблемы.
-
By Nigelist
Имеется конструкция типа:
<p><img src="image.jpg"></p>Как можно с помощью CSS, указать выравнивание по середине?
-
By maximamus
Добрый день!
Помогите пожалуйста разобраться. Хочу сделать, что бы при клике на кнопку, в любом положение (сверху или снизу) объект который открывался, был по центру. То есть, по сути - нажал на кнопку, страница выровнялась относительно кнопки по центру.
У меня есть два таких объекта.
Один построен на iframe
<div id="ch1">
<div id="closeButton" onclick="document.getElementById('ch1').style.display='none'">Х</div>
<iframe src="/Summer2015_02/" width="1070" height="508">Ваш браузер не поддерживает плавающие фреймы!</iframe>
</div>
<div class="showcase">Подробнее<input type="button" value="" onclick="document.getElementById('ch1').style.display='block'">
</div>
другой - document.getElementById
<div id="divwin">
<div id="closeButton" onclick="document.getElementById('divwin').style.display='none'">Х</div>
<p>...</p>
</div>
<div id="btopen">
<p>...</p>
<input type="button" value="Подробнее..." onclick="document.getElementById('divwin').style.display='block'">
</div>
-
-
Обсуждения
-
Доброго всем времени суток. Прошу помощи. Научите принципу изменения футера. Движок 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/. Типовые приемы и нестандартные на все случаи жизни. Накидайте ссылок. -
By Katerina23 · Posted
Да, подходит. Спасибо. -
<input type="number"> -
By Katerina23 · Posted
Здравствуйте, подскажите какой тег использовать для увеличения значения, пример на картинке. Вроде, про такой тег я слышала. Если есть тег прогресс бар, значит и такое должно быть.
-
Question
perec200
Здравствуйте! Как выровнять блок по середине относительно двух крайних?
На codepen лежит свёрстанный слайдер у которого красный блок прижимается к левому, как мне его выставить по середине относительно двух? http://codepen.io/anon/pen/XJVKNg
Спасибо!
Link to comment
Share on other sites
3 answers to this question
Recommended Posts
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.