Nerwoid

Выравнивание блоков/элементов

Рекомендованные сообщения

Ребят всем привет! Я только начал изучать верстку по видео урокам на ютубе. У меня есть свой макет который я купил у дизайнера. Решил с него поучиться верстать. Подскажите как правильно сделать шапку сайта. У меня все выравнивания происходят с помощь отрицательных "margin".  Судя по урокам, везде делают это с помощью flex и тому подобное. Дизайн очень оказался сложным и там много проблем с фонами. Дайте пару советов и подсказок как продолжать дальше. Заранее спасибо 😉

 

Вот: макет:

Мой сайт

 

Изменено пользователем Nerwoid

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

У вас не закрыта ссылка в логотипе.

Вот с помощью флексов https://codepen.io/corvus-007/pen/Jwxbbg?editors=1100

Вы будет верстать под мобильный? А то я там добавил кнопку меню, но без функционала и доп стилей для навигации.

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Спасибо большое, но я еще многое чего не понимаю. Да, хочу адаптивно сверстать.

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Люди добрые, еще такой вопрос появился. Забыл сказать, что мой макет уже сверстан фрилансером, вот посмотрите по этому адресу Stick-bot.ru

Он когда верстал, сказал с макетом какие-то проблемы и в полный экран его нельзя сверстать из-за фонов или чего-то там. Я хочу сам с нуля его сверстать немного по другому, опытные люди, скажите пожалуйста, это правда что его не получится во весь экран сверстать ?

отсупы.jpg

Изменено пользователем Nerwoid

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

В каком-то смысле да — это правда. Вот как будет выглядеть сайт на всю ширину: http://take.ms/hQx6Q
Обратите внимание на фоновые картинки.

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

А как тогда начать верстать? Задать на body - max widh 800px или как определить эти размеры? То есть получается сначала будет backgraund-image (белый фон с еле заметными картинками по бокам) и на этом backgraundе весь контент сайта в ограниченную ширину. Как это сделать проще всего и попонятнее что бы было)

Изменено пользователем Nerwoid

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Как сделать ограниченную ширину контента по всему сайту?  (т.к. сделал это фрилансер)

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Так же как это уже было реализовано разработчиком, использовать

max-width: Npx;

 

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
1 минуту назад, klierik сказал:

Так же как это уже было реализовано разработчиком, использовать


max-width: Npx;

 

применить ко всему body ?

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Это будет зависеть от того как именно Вы будуте создавать layout. Это может быть как "<body>" так и ".wrapper"

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Ребята, в процессе верстки данного макета возникли сложности. Подскажите как сделать что бы фоновые изображения не разъезжались при масштабировании экрана? 

Верстка

Проблема на скриншоте:

Проблема.jpg

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Создайте аккаунт или войдите в него для комментирования

Вы должны быть пользователем, чтобы оставить комментарий

Создать аккаунт

Зарегистрируйтесь для получения аккаунта. Это просто!

Зарегистрировать аккаунт

Войти

Уже зарегистрированы? Войдите здесь.

Войти сейчас

  • Похожие публикации

    • Автор: artaka
      Работаю верстальщиком за небольшую плату (100-300руб в зависимости от работы) Связь со мной : 
      VK vk.com/artakagrand
      Telegram @artakagrand
      email fefsert@gmail.com
      Примеры работ:
      http://teslamodelx.epizy.com
      http://teslamodelx.epizy.com/infoblog/index.html
      http://teslamodelx.epizy.com/blog/index.php
    • Автор: Ranell
      Приветствую, оцените пожалуйста вёрстку.
      Прошу не кидать в меня тапками. Недавно начал заниматься вёрсткой.
      https://codepen.io/Ranell/pen/VgVxPb
    • Автор: ZAMPOREZKE
      Оцените верстку и скажите, что не так.Заранее спасибо.
      https://zamporezke.github.io/
  • Сейчас на странице   0 пользователей

    Нет пользователей, просматривающих эту страницу.