Горизонтальне адаптивне меню на Flexbox

 Приклад реалізації горизонтального меню за допомогою  властивостей контейнера

Приклад меню без застосування медіа-запитів:

See the Pen Bulletproof flexbox navigation by kravets (@raisa69) on CodePen.

Приклад меню з медіа-запитами

See the Pen Flex navmenu сontent by kravets (@raisa69) on CodePen.

Приклад меню з медіа-запитами

See the Pen nav responsive Flexbox by kravets (@raisa69) on CodePen.

Приклад меню з медіа-запитами

See the Pen Responsive Flexbox Nav by kravets (@raisa69) on CodePen.

Приклад меню з медіа-запитами

See the Pen Flexbox Nav with Brand Logo by A. James Liptak (@AJamesL) on CodePen.

Приклад меню з медіа-запитами

Завдання 1 

Створити  адаптивне меню такого зразка

- на розмірах екранів більше  1025px меню має виглядати так:

- на розмірах екранів менших 1025px і більше 769px  має бути такий вигляд

- на екранах, менших за 769px вигляд такий

See the Pen Flexbox Navigation Bar task by kravets (@raisa69) on CodePen.

Завдання 2

1. Створити меню згідно зразка

2. Адаптувати меню для екранів менше 400px до такого виду

See the Pen Flexbox Navbar by kravets (@raisa69) on CodePen.

p