Creating HTML and CSS Markup - Realtime Web Apps: With HTML5 WebSocket, PHP, and jQuery - page 146

Figure 7-26. The styled presenter view with an active state for the “answer” button
Updating the Media Queries
The media queries for the presenter view follow suit with those from the attendee view, except instead of moving the
vote count above the button on the left, it goes below the count on the right.
Other than that, the “close this room” form gets reflowed to fit with the single-column layout on tablets and
handheld devices.
Update the existing rules and add the new rules to the “Media queries” section of main.css as shown here:
@media screen and (max-width: 960px)
{
section header ,#close-this-room {
float: none;
width: 680px;
margin: 0 auto 1.5em;
overflow: hidden;
}