Join Joseph Lowery for an in-depth discussion in this video Ensuring touch-screen compatibility, part of Building Mobile Sites with Dreamweaver and WordPress.
Tablets almost universally rely on a touchscreen interface.…As such, you need to give special consideration to issues that may arise with…navigation and form interaction.…On our example site, like many WordPress sites, the sidebar is link intensive.…On the Desktop, there is a little separation between the links,…but it looks to me like it's kind of tight on the tablet.…So let's open that up. In order for me to find exactly what the selector is, I am…going to rely on Inspect mode one more time.…
And let's take a look here, and I see I have an anchor tag, and it is…within a list item.…So if go up the DOM there, there is the list item.…I don't seem to have a rule that is affecting it;…this is a more general rule.…So let's go into our tablet stylesheet, and we'll add a new rule that's targeting…the widget-area class; ul li.…That's the list item within the unordered list, that's within the widget-area.…
So in order to open this up, I am going to add some padding to the bottom, and I…am going to try a value of 7em.…
- Setting up an existing WordPress site
- Targeting configurable site elements
- Setting up media queries
- Preparing for adaptive images
- Styling a blog for tablets
- Restructuring navigation for different-sized displays
- Developing a WordPress site for phones
Skill Level Intermediate
Dreamweaver and WordPress: Core Conceptswith Joseph Lowery5h 44m Intermediate
WordPress Themes: Photography Portfolioswith Morten Rand-Hendriksen53m 2s Intermediate
1. Preparing Your Site to Go Mobile
Understanding media queries3m 50s
2. Retrofitting for Multiple Screens
3. Implementing a Full Mobile Redesign Strategy
4. Styling a Blog for Tablets
5. Developing a WordPress Site for Phones
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.