Awesome! Awesome! Awesome!
I configured the CSS code so that it would work on PC’S, Popular Tablets and Phones.
You might want to consider posting this on your forum or on your CodeCanyon support page.
I have an iPad 2.
1) If you have an iPad 3, 4, Air, or iPad Mini, please let me know if the Search field is lined up with the navigation links when the tablet is held in landscape ( IE – wide ) position.
2) What would be the proper CSS code for an iPad Mini ?
================================
/* This keeps the Search field from shrinking upon each inquiry made */
/* Regular pc & others */
#ajaxsearchprowidget-4 {
width: 265px !important;
float: right !important;
}
/* Search field width on Smartphones (Held vertically) ----------- */
@media only screen
and (min-device-width : 350px)
and (max-device-width : 600px) {
#ajaxsearchprowidget-4 {
width: 320px !important; /* Was originally 486px */
float: none !important;
margin: 0 auto;
}
}
/* Search field width on Smartphones (Held horizontally) ----------- */
@media only screen
and (min-device-width : 550px)
and (max-device-width : 800px) {
#ajaxsearchprowidget-4 {
width: 420px !important; /* Was originally 486px */
float: none !important;
margin: 0 auto;
}
}
/* Search field width on iPad 2 and iPad Mini Tablets (Held horizontally) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
#ajaxsearchprowidget-4 {
width: 265px !important; /* Was originally 486px */
float: none !important;
margin: 0 auto;
}
}
/* Search field width on iPads 3, 4, iPad Mini w. Retina, and Air Tablets (Held horizontally) ------*/
@media only screen
and (min-device-width : 1536px)
and (max-device-width : 2048px) {
#ajaxsearchprowidget-4 {
width: 265px !important; /* Was originally 486px */
float: none !important;
margin: 0 auto;
}
}
===================================
Look forward to your reply.