I am working on the Holy Grail layout challenge, and I have gotten it to what I would consider to be 95% of the way there by modelling the “Solved By Flexbox” website. On the left of the “ul” (styled with .thumbnail-item in css), there seems to be an extra 40px of padding that I did not put in the css. Please see the box model diagram in the screenshot…
In Chrome Dev Tools, I do see “-webkit-padding-start: 40px;” in the user agent stylesheet, but I do not know how it got there. Does this have something to do with the way flexbox draws elements on the page?