1
Student
100%
Completion rate
In this challenge, you implement the adaptive weather widget at two resolutions:
- From 400px to the width of viewport
- Up to 400px in width of viewport
Before you, the other developer has already done the basic markup and styles of the widget, but it turned out that that developer does not know the Flex module and adaptability at all. So you have to complete the job. Based on the layout, complete the widget at different screen resolutions. Position the widget in the center of the screen.
Weather widget with a viewport width of 600px
Weather widget with a viewport width of 399px
At this resolution, the indent between the image and the information part: 1rem
Hints
- The horizontal version of the widget is conditionally divided into three parts. The information area occupies two parts, the image of the city occupies one part
For full access to the challenge you need a professional subscription.
A professional subscription will give you full access to all Hexlet courses, projects and lifetime access to the theory of lessons learned. You can cancel your subscription at any time.