Customizer, Preview: Visual survey of customizer device preview

Screenshots from my testing sessions for #31195 and #35875.

Macnchrome, sidebarSidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme. expanded

#gallery-16 {
margin: auto;
}
#gallery-16 .gallery-item {
float: left;
margin-top: 10px;
text-align: center;
width: 33%;
}
#gallery-16 img {
border: 2px solid #cfcfcf;
}
#gallery-16 .gallery-caption {
margin-left: 0;
}
/* see gallery_shortcode() in wp-includes/media.php */

Macnchrome, sidebar collapsed

#gallery-17 {
margin: auto;
}
#gallery-17 .gallery-item {
float: left;
margin-top: 10px;
text-align: center;
width: 33%;
}
#gallery-17 img {
border: 2px solid #cfcfcf;
}
#gallery-17 .gallery-caption {
margin-left: 0;
}
/* see gallery_shortcode() in wp-includes/media.php */

Macnfirefox, sidebar expanded

#gallery-18 {
margin: auto;
}
#gallery-18 .gallery-item {
float: left;
margin-top: 10px;
text-align: center;
width: 33%;
}
#gallery-18 img {
border: 2px solid #cfcfcf;
}
#gallery-18 .gallery-caption {
margin-left: 0;
}
/* see gallery_shortcode() in wp-includes/media.php */

Macnfirefox, sidebar collapsed

#gallery-19 {
margin: auto;
}
#gallery-19 .gallery-item {
float: left;
margin-top: 10px;
text-align: center;
width: 33%;
}
#gallery-19 img {
border: 2px solid #cfcfcf;
}
#gallery-19 .gallery-caption {
margin-left: 0;
}
/* see gallery_shortcode() in wp-includes/media.php */

Tablets and phones don’t have device preview.

iPad Air

#gallery-20 {
margin: auto;
}
#gallery-20 .gallery-item {
float: left;
margin-top: 10px;
text-align: center;
width: 33%;
}
#gallery-20 img {
border: 2px solid #cfcfcf;
}
#gallery-20 .gallery-caption {
margin-left: 0;
}
/* see gallery_shortcode() in wp-includes/media.php */

iPhone 6+

#gallery-21 {
margin: auto;
}
#gallery-21 .gallery-item {
float: left;
margin-top: 10px;
text-align: center;
width: 33%;
}
#gallery-21 img {
border: 2px solid #cfcfcf;
}
#gallery-21 .gallery-caption {
margin-left: 0;
}
/* see gallery_shortcode() in wp-includes/media.php */

iPhone 5

#gallery-22 {
margin: auto;
}
#gallery-22 .gallery-item {
float: left;
margin-top: 10px;
text-align: center;
width: 33%;
}
#gallery-22 img {
border: 2px solid #cfcfcf;
}
#gallery-22 .gallery-caption {
margin-left: 0;
}
/* see gallery_shortcode() in wp-includes/media.php */

Nexus 5

#gallery-23 {
margin: auto;
}
#gallery-23 .gallery-item {
float: left;
margin-top: 10px;
text-align: center;
width: 33%;
}
#gallery-23 img {
border: 2px solid #cfcfcf;
}
#gallery-23 .gallery-caption {
margin-left: 0;
}
/* see gallery_shortcode() in wp-includes/media.php */

#31195, #35875, #android, #chrome, #customize, #customizer, #desktop, #ios, #macos, #phablet, #phone, #preview, #safari, #visual-survey