Hello, I am having problems getting my images in module 9 to change locations when viewed on small viewports. As of now, when viewed on a small screen the image is very small (50px x 36px) and to the left of the text. I want to change the location of the image to underneath the ‘item-details’ div when viewed on small viewports. How are these changes implemented?
Great theme and thanks in advance!
Hello,
Try this css, add it in style.css
@media (max-width: 767px) {
.td_mod9 .item-details {
margin-left: 0px !important;
}
.td_mod9 .thumb-wrap .entry-thumb {
max-height: none !important;
max-width: 100% !important;
height: auto;
width: auto;
position: relative;
margin-bottom: 15px;
}
}Thanks for the message!
Thank you for your reply. I did get a change, but not the one I was hoping for. My main goal is to get module 9 to look like module 7 (@ 767 px) when viewed on small viewports, with the title being listed first, the post date and tags underneath the title, then the picture underneath the post date, and the excerpt underneath the picture.
Is it possible to switch from module 9 to module 7 when that 767px max-width gets hit?
Thank you for replying!
Hello,
Is not possible, we can make changes only in css, sorry for the inconvenience! If you want, you can try from CSS to move the title above the image, but I’m not sure is possible easily.
Thanks for understanding!
Have a nice day!
