November 2014
Beginner to intermediate
1026 pages
33h 9m
English
Content preview from Dreamweaver CC: The Missing Manual, 2nd Edition
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
O’Reilly covers everything we've got, with content to help us build a world-class technology community, upgrade the capabilities and competencies of our teams, and improve overall team performance as well as their engagement.I wanted to learn C and C++, but it didn't click for me until I picked up an O'Reilly book. When I went on the O’Reilly platform, I was astonished to find all the books there, plus live events and sandboxes so you could play around with the technology.I’ve been on the O’Reilly platform for more than eight years. I use a couple of learning platforms, but I'm on O'Reilly more than anybody else. When you're there, you start learning. I'm never disappointed.I'm always learning. So when I got on to O'Reilly, I was like a kid in a candy store. There are playlists. There are answers. There's on-demand training. It's worth its weight in gold, in terms of what it allows me to do.
Chapter 13. Building Fluid Grid Websites
If you want to design a single set of web pages that people can read whether they’re on a smartphone, tablet, or desktop computer, you need the power of fluid grid layouts. Fluid grid layouts let you create a single HTML file whose design morphs to fit phone, tablet, and desktop browsers. They combine the results of a media query (Media Queries) with a fancy grid-based design to create pages customized for the destination device (a practice called “responsive Web design” in Internet argot). The page’s responsive layouts are based on three basic browser widths representing mobile, tablet, and desktop devices (see Figure 13-1). The pages then use percentage widths to scale the layout for specific devices—after all, not all mobile phones have screens that are precisely 320 pixels wide, nor do all tablets have displays that are exactly 760 pixels wide. Using fluid grid layouts, you can create designs that scale to a range of widths and adapt for the myriad screen sizes on mobile, tablet, and desktop devices.
Note
Responsive Web design (RWD) is a term coined by the web designer Ethan Marcotte. You can learn more about it from the article that kicked off the RWD movement at www.alistapart.com/articles/responsive-web-design/.
Figure 13-1. The web design site Smashing Magazine (http://smashingmagazine.com) uses responsive Web design to customize the site’s ...
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Read now
Unlock full access
More than 5,000 organizations count on O’Reilly
O’Reilly covers everything we've got, with content to help us build a world-class technology community, upgrade the capabilities and competencies of our teams, and improve overall team performance as well as their engagement.Julian F.
I wanted to learn C and C++, but it didn't click for me until I picked up an O'Reilly book. When I went on the O’Reilly platform, I was astonished to find all the books there, plus live events and sandboxes so you could play around with the technology.Addison B.
I’ve been on the O’Reilly platform for more than eight years. I use a couple of learning platforms, but I'm on O'Reilly more than anybody else. When you're there, you start learning. I'm never disappointed.Amir M.
I'm always learning. So when I got on to O'Reilly, I was like a kid in a candy store. There are playlists. There are answers. There's on-demand training. It's worth its weight in gold, in terms of what it allows me to do.