From the course: CSS: Float-Based Page Layouts (2012)
Unlock the full course today
Join today to access over 22,600 courses taught by industry experts or purchase this course individually.
Building responsive layouts: Solution - CSS Tutorial
From the course: CSS: Float-Based Page Layouts (2012)
Building responsive layouts: Solution
I hope you enjoyed working through the responsive-layout lab. Now, creating responsive layouts takes a lot of focus and planning, and just being dropped into the middle of a partial layout like you guys were is a little bit challenging. So let's take a look at the solutions to your tasks and then discuss some of the other responsive features of this particular layout. So I have the index.htm and the main.css opened up from the finished_files directory in the 07_06 folder. And the first thing that you were tasked to do is to create a viewport tag that forces mobile devices to set their viewport width to the actual device width and to set the initial scale at 100%. And there is the syntax for that right there on line number 6. A couple of things where people typically make mistakes within the syntax is the comma-separated list of properties here. They might have another set of quotation marks, for example. They may forget the comma. So check out your syntax and make sure that it matches…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Contents
-
-
-
-
-
-
-
-
-
(Locked)
Responsive layout overview3m 49s
-
(Locked)
Using media queries7m 16s
-
(Locked)
Organizing styles8m 39s
-
(Locked)
Making content responsive8m 33s
-
(Locked)
Mobile design considerations7m 32s
-
(Locked)
Building responsive layouts: Lab4m 23s
-
(Locked)
Building responsive layouts: Solution9m 24s
-
(Locked)
-
-