Полосы в psd макете & вопросы

[SatoRi]

Здравствуйте.
При верстке по psd макету столкнулся с проблемой разметки одного из элементов, а именно полосы над и под основным содержимым главной страницы.
Собственно вопрос: эти полосы реализовывать как изображение? Если да, то тегом img или div?
И еще вопросик по шаблону: можно ли обрезать изображения с помощью css? К примеру левое изображение людей при нарезке изображений из макета в фотошопе у меня немного более полное, а на картинке снизу оно несколько обрезанное(немного приближено).

Как реализовать эту серую разделяющую линию в основном контенте? border-left/right немного не так ее изображает(по высоте блока, а на картинке она ниже) или это не столь важно? 

И что лучше использовать в моем случае при разметке основного содержимого, float или display: inline-block?

[Tilonorrinco]

1) полосы -- фон, который задается либо через изображение, либо через градиент

2) фон этот, скорее всего, присвоен блоку-обертке, который является родительским для двух других блоков (с текстом who we are, what we do)

3) изображения можно обрезать через css, поместив их в контейнер (типа <figure>) с overflow: hidden. Но проще всего обрезать в фотошопе.

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

5) Сетку можно строить как через флоат, так и через инлайн-блок, у каждого способа свои плюсы и минусы.

[klierik]

1) это див с фоновой картинкой gif/png. Хотя может и градиент такое умеет

[SatoRi]

3 hours ago, Tilonorrinco said:

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

Как-то сложно, но все равно, спасибо большое)

[Tilonorrinco]

SatoRi, на самом деле все просто:

https://jsfiddle.net/Tilonorrinco/xgaawnhb/

Здесь псевдоэлемент (тот, который .wrapper:before) стилизован под рамку, растянут по ширине блока-обертки (80% от wrapper) и отцентрирован по-вертикали.

[SatoRi]

Tilonorrinco, премного благодарен, теперь понятно.
плюсик вам в карму)