bigbite / macy.js

http://macyjs.com/
MIT License
1.3k stars 156 forks source link

Weird bottom margin? #36

Closed jcklpe closed 6 years ago

jcklpe commented 6 years ago

Hey I'm sorry to bother you. I honestly feel kind of dumb coming to ask for help with this because I feel like this is something I probably should be able to figure out myself but I've been whacking my head against this for a couple of hours and I thought I'd post this before bed.

So I've got an implementation of Macy.js in a custom WP theme I made for my portfolio website. It was running fine on local, and on my host, but then when I installed a caching program, and ripped out all this old bootstrap code, it's started having this weird effect of adding margin to the bottom of pictures.

I can adjust it by re running my init function and setting the margin to -5. That applies to both the x and the y though so it comes out looking weird. And if I apply it to the x and y separately then it does some really weird stuff and has everything overlapping each other.

The website can be found here: https://www.jackalope.tech/side_project/illustration/

Maybe you will have a better sense of what's going on?

Again, I'm sorry to be a bother.

jrmd commented 6 years ago

hey @thedonquixotic

After looking into this, I noticed it was an issue with the styles. If you set the image as vertical-align: top; your issue should be fixed. This puzzled me at first but looking on Stack overflow I found the answer.

Hope this helps.

Thanks, Jerome

jcklpe commented 6 years ago

Thank you @jrmd ! I am still very much a novice developer. I was a designer who was taught using bootstrap. And I finally got so annoyed with bootstraps outdated practices that I ripped it out of my 98% finished project and then found I had a bunch of bugs I'd never even seen before. I've relied on it too much to normalize my css. Thank you so much for the help.