CSS flex split menu

YvonneDev
Apr 8, 2019

--

Page here
Github Download

STEP1:
HTML

Three columns contain cover with title and logo image, and the content is the menu lists hidden first.

STEP2:
CSS

Google Fonts imported.
The container displays flex.
Each screen occupied the same space with flex-grow:1.
The pink square centered all the tags inside.

Different background colors for screen and content.
When hovering, the screen expands to 5 times.

The content can not see at first. When hovering the button and the content, the content shows up with animation.

👉Follow me for more useful web development content! love sharing🥰

--

--

YvonneDev
YvonneDev

Written by YvonneDev

❤️Front-end Web Development self-taught *share what I learned*

No responses yet