alejandro13

С помощью свойства background-position.

https://jsfiddle.net/zfygjnwc/

Проблема в том, что верстка под IE9 все еще актуальна - а там flexbox не поддерживается

 

Можно не ставить блокам large_block,small_block и т.д ширину в 100% так как они и так будут растягиваться на всю ширину + не надо ставить им min-height. Изображение в left_block и right_block надо добавлять через тег img а не через фон в css + лучше кнопку DETAILS сделать просто тегом a, то есть не давать ей обертку button.

Спасибо, действительно, все логично. Изображения добавил т.к позицию их надо было менять или можно как-то иначе? А что не так с оберткой button?

А в чем уклон на адаптивность? При уменьшении окна контент срезается.

Проверьте валидность кода.

Неплохо бы использовать shorthand.

1. Ну он в принципе корректно отображается на всех проверенных устройствах.
2. html и css через валидатор прогонял
3. Да, согласен, косяк.

 

То есть вас не смущает наличие девяти ошибок в html?

Насчет корректности отображения - если жестко пофиксить все блоки, то они конечно не разваливаются, но не в этом же суть адаптивности.

А в чем уклон на адаптивность? При уменьшении окна контент срезается.

Проверьте валидность кода.

Неплохо бы использовать shorthand.

Если вам просто нужно, чтобы фон у дива с классом a2 растягивался по всей высоте, то можно этот фон просто дать родителю

https://jsfiddle.net/8zwc9pfb/

Уменьшите экран браузера и посмотрите, как нехорошо срезается фон у блоков

Без JS тут не выкрутиться)

https://jsfiddle.net/jrop4bj1/

Можно дать этим блокам обертку и отцентрировать ее относительно родителя.

Примерно так:

https://jsfiddle.net/867xju4p/

Как-то так?

https://jsfiddle.net/8sLv7jsz/

можно добавить 

Дайте пунктам меню одинаковую ширину, иначе ничего у вас переноситься не будет - они у вас растягиваются по содержимому

Можно блоку с классом unit дать line-height:0 и отступ внизу исчезнет

В Вашей верстке у логотипа какой-то дополнительный фон, которого не должно быть по макету.

Внутри блоков с контентом междустрочный интервал у Вас явно меньше, чем должен быть.

Опять же исходя из макета, фон у блока с навигацией явно имеет другие цвета и ссылкам надо дать хоть какой-то ховер - text-decoration:underline, например.

 Ну и в форме поиска я бы цвет тексту белый дал, а не черный)

Неудобно здесь общаться оказалось.

Но да ладно.

С несколькими чуть позже в скайпе пообщаюсь.

Я тоже с радостью поверстаю))

Скайп: alex_vasilenko13

Я бы добавил :hover к нижней навигации, кнопкам more, send, subscribe.

В форме внизу страницы шрифт в textarea и инпутах разный шрифт.

 

А скажите пожалуйста, мил человек, какой это именно псевдоэлемент должен быть?

Я бы :after использовал, в данном случае

 

 

 

Правда есть одно НО - этот бордер на кнопке прозрачный - через него видно фон страницы. Но можно допустить, что бордер все же белый)

Ну можно и так, псевдо-элемент можно через position:absolute; вывести за границу кнопки и отступить на 1px, а кнопке задать position: relative; 

На псевдоэлемент наложить такой же градиент, а иконку, либо картинкой вторым фоном, либо ввиде символа через content, а иконку в иконочный шрифт засунуть. Как-то так

 

 

А скажите пожалуйста, мил человек, какой это именно псевдоэлемент должен быть?

Я бы :after использовал, в данном случае

 

 

 

Правда есть одно НО - этот бордер на кнопке прозрачный - через него видно фон страницы. Но можно допустить, что бордер все же белый)

Ну можно и так, псевдо-элемент можно через position:absolute; вывести за границу кнопки и отступить на 1px, а кнопке задать position: relative; 

На псевдоэлемент наложить такой же градиент, а иконку, либо картинкой вторым фоном, либо ввиде символа через content, а иконку в иконочный шрифт засунуть. Как-то так

 

Спасибо, я разобрался. Делал изначально в принципе, то что ты и посоветовал, просто пытался повесить псевдоэлемент на инпут)  

Фон градиенты и тени помогут создать, текст - это текст, стрелку псевдоэлементом с иконкой стрелки и бордером слева.

Ну и лучше использовать button вместо input:submit

Я о тэге button не подумал) Ведь на input псевдоэлемент не повесишь.

Правда есть одно НО - этот бордер на кнопке прозрачный - через него видно фон страницы. Но можно допустить, что бордер все же белый)

Приветствую всех участников форума!

Подскажите, пожалуйста, как оформить кнопку отправки формы:

http://prntscr.com/9aybj3

Таких кнопок на сайте будет несколько и с разным содержимым, поэтому повесить одну большую картинку на бэкграунд думаю будет ошибкой. Полоска, разделяющая текст и стрелку вправо должна быть прозрачной.

https://all-psd.ru

Доброго всем времени суток!

Подскажите пожалуйста, как убрать модуль "Новинки" (последние добавленные товары) в шаблоне интернет-магазина на Opencart.

Доброго всем времени суток!

Подскажите, пожалуйста, как в приведенном ниже блоке выровнять кнопки 1,2 и 3 по центру?

HTML-код:

 <div class="bottom_nav_wrap"><div class="bottom_nav"><ul><li class="previuos"><a href="#">« Previous</a></li><li class="pages active"><a href="#">1</a></li><li class="pages"><a href="#">2</a></li><li class="pages"><a href="#">3</a></li><li class="next"><a href="#">Next »</a></li></ul></div> </div>

CSS-код:

.bottom_nav_wrap{padding:10px 0;background: url(../img/content-border.png) top left repeat-x;} .bottom_nav_wrap .bottom_nav{padding:10px;font-size:20px;font-weight:bold;background: rgb(223,237,245);border:1px solid rgb(197,226,243);position:relative;} .bottom_nav ul li {display:inline-block;background:rgb(165,191,207);} .bottom_nav ul li a{text-decoration:none;padding:14px;color:rgb(255,255,255);display:block;} .bottom_nav ul li a:hover{background:rgb(33,140,200);} ul li.pages{background:rgb(33,140,200);} ul li.next{position:absolute;top:10px;right:10px;} .bottom_nav ul li.active{background:rgb(18,92,135); }

Спасибо, psywalker!

На сайте в таблице требуется при наведении на строку курсора выделять ее другим цветом. Но задаваемый мной стиль не работает: