Alex E.
asked on
Bootstrap with media queries and moving an image with CSS
Hello I want to use media queries to move an image. For example in these range of media queries:
For each query I want to move an image if possible via CSS. For example if browser resolution apply for first media query 320px min has CSS a left position the of the image if browser is resized to query 480px then the object has a new left position in other words must move to left in a percent or pixels and in that way for all queries. For each resolution reached the object needs to move to the left dynamically and each query is like a PIN for the new left position. I don't know what is the best way to move dynamically to the left the object while the queries are reached. Or if there is a better way to do is ok. If you can give me tips but if you can put examp,e of codes would be great.
/*==================================================
= Bootstrap 3 Media Queries =
==================================================*/
/*========== Mobile First Method ==========*/
/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {
}
/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {
}
/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {
}
/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
}
/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
}
For each query I want to move an image if possible via CSS. For example if browser resolution apply for first media query 320px min has CSS a left position the of the image if browser is resized to query 480px then the object has a new left position in other words must move to left in a percent or pixels and in that way for all queries. For each resolution reached the object needs to move to the left dynamically and each query is like a PIN for the new left position. I don't know what is the best way to move dynamically to the left the object while the queries are reached. Or if there is a better way to do is ok. If you can give me tips but if you can put examp,e of codes would be great.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
JavaScript can work but it should only be a fallback solution when a CSS solution is not possible.
Without seeing your HTML it is not possible to make a recommendtaion.
Without seeing your HTML it is not possible to make a recommendtaion.
ASKER
Solved in JavaScript
Then modify for each width going up from that
Open in new window
To be more specific would need to see your HTML.