CSS Help: Image Sizing/Padding (?) Issue
CSS Help: Image Sizing/Padding (?) Issue
|
|
---|---|
Posted 2021-02-25 12:11:12 (edited)
Hi all - looking to see if anyone could help me:) I've been learning CSS and tinkering with my profile. I use d:n to hide a lot of stuff that I want to see, for that ~aesthetic~ look, and usually - as it should - the items adjust around it as it removes it from the page. I want my featured wolf's avatar to be the same size as my Lead's - I have that down (removed the text above and resized the avatar to match) but I can't seem to get them aligned to be on the same level. It tried adjusting from the right etc offsetting with -px, but it isn't dynamic. It just never seems to properly align with each other. Is there another/best way to do this? Thanks so much for any and all help:) It looks fine on mobile, but not on desktop. Would love to actually bring down the lead's avatar to be aligned with the current Featured's position. On my profile; snippet here in case that changes: |
pample🌙 #10696 |
Posted 2021-02-25 12:59:31
To get rid of the empty space altogether:
There’s a line break hard-coded in right before that image, not padding or margins; this is the only workaround I’ve found. It’ll mess up the padding on mobile (but I’d guess you know how to fix that), and unfortunately I’m not 100% sure you can override the wolf name/link font size to make it visible. Alternatively, to move the lead image down:
I like using em units over pixel units because, for the most part, they scale consistently on mobile & make for more accessible font sizes. Second line is for getting rid of the ugly green box, which lurks right behind the image for some reason; you might not need the !important overrides if you reorder the code, but I was just doing this with inspect element. Hope this helps! :> |
🐺 #9672 |
Posted 2021-02-25 13:07:32
Ahh, this makes so much sense. Thank you so much - you knew exactly what I was going for ahah:) Gonna play around with this in a bit, I appreciate it so much! And the em units bit is insanely helpful as well - that changes everything for me ahah. Yes, that ugly green box...when I originally was doing a transparent inner border, it was killer. Maybe it will work now with this :,) Thank you so much! If I can ever be helpful in return, please let me know! |
pample🌙 #10696 |
Posted 2021-02-25 13:14:22
Awesome, glad to hear it helped! And especially cool to know you’ll be looking into em units; they’re super useful and not known enough! And y’know, I honestly did not realize the green box was still there until messing with it just now, but Wolvden code is just full of surprises :D No need to do anything in return, and good luck with your layout! |
🐺 #9672 |