I was hoping to find someone who could help me with possibly making my pet images auto size on mobile. It's not the biggest deal, but I noticed on my phone that my pet images don't size down with the layout boxes, so they stick out of their section. I don't know if it's something that can even be done as it's just on mobile, but fine on PC.
this should work though did this quickly so idk if there are any unwanted side effects though
Thank you for replying! I am not sure where exactly to put that though. I looked in the code and didn't see something that said content_pets img. This is the pet reformatting section if that helps?
*/
tbody { display: flex !important; justify-content: center; flex-wrap: wrap; }
tr { display: inherit !important; width: 100% !important; }
td { width: inherit !important; margin-bottom: 10px; }
table#content_pets a { flex:1; }
.data div.avatar_head { border-radius: 8px !important; width: 100% !important; /* max-width: 60px !important; / / height: 60px !important; */ background-repeat: no-repeat !important; cursor: pointer; margin-bottom: 5px !important; }
/*
should be fine before or after those or other added selectors since there is no conflict with them
Ahhh, it worked! Thank you!! My pet all alone on the last row is huge compared to the rest, lol, but that's fine. I'll eventually get another pet. xD
you're welcome
if it matters that last pet can be fixed, add the following selector should be fine anywhere but I recommend after the selector I gave you
tr:last-child:nth-of-type(odd) img {
max-width: 40%;
}