Responsive web design online test

Share
Do you need a responsive dialogs ? try AlertifyJS

Responsive web design test on portrait viewport 320 x 480


Media query:
@media screen and (max-width: 320px), (min-device-width: 320px) and (max-device-width: 480px) and (orientation : portrait) {
/* CSS */
}

Responsive web design test on landscape viewport 480 x 320


Media query:
@media screen and (min-width: 320px) and (max-width: 480px), (min-device-width: 320px) and
(max-device-width: 480px) and (orientation : landscape)
{
/* CSS */
}

Responsive web design test on portrait viewport 320 x 568


Media query:
@media screen and (max-width: 320px), (min-device-width: 320px) and (max-device-width: 568px) and (orientation : portrait) {
/* CSS */
}

Responsive web design test on landscape viewport 568 x 320


Media query:
@media screen and (min-width: 320px) and (max-width: 568px), (min-device-width: 320px) and
(max-device-width: 568px) and (orientation : landscape)
{
/* CSS */
}

Responsive web design test on portrait viewport 360 x 640


Media query:
@media screen and (max-width: 360px), (min-device-width: 360px) and (max-device-width: 640px) and (orientation : portrait) {
/* CSS */
}

Responsive web design test on landscape viewport 640 x 360


Media query:
@media screen and (min-width: 360px) and (max-width: 640px), (min-device-width: 360px) and
(max-device-width: 640px) and (orientation : landscape)
{
/* CSS */
}

Responsive web design test on portrait viewport 600 x 960


Media query:
@media screen and (max-width: 600px), (min-device-width: 600px) and (max-device-width: 960px) and (orientation : portrait) {
/* CSS */
}

Responsive web design test on landscape viewport 960 x 600


Media query:
@media screen and (min-width: 600px) and (max-width: 960px), (min-device-width: 600px) and
(max-device-width: 960px) and (orientation : landscape)
{
/* CSS */
}

Responsive web design test on portrait viewport 768 x 1024


Media query:
@media screen and (max-width: 768px), (min-device-width: 768px) and (max-device-width: 1024px) and (orientation : portrait) {
/* CSS */
}

Responsive web design test on landscape viewport 1024 x 768


Media query:
@media screen and (min-width: 768px) and (max-width: 1024px), (min-device-width: 768px) and
(max-device-width: 1024px) and (orientation : landscape)
{
/* CSS */
}
Feedback & Suggestions: info@isresponsive.com