Why doesn't an automatic margin work for blockquote?

[frankernesto.ramirez]

I don’t understand why the blockquote block when testing the site on a smaller screen resolution doesn’t automatically take an auto margin if it was declared in its @media as in the case of #tribute-info. This is site in codepen: https://codepen.io/FrankERT/pen/oNoZgdj
Could someone help me? Or what is missing from the code?

[LucLH]

Hi @frankernesto.ramirez,

I watched your code to understand what’s happen. I realised that you apply the styles for the blockquote selector. But inside, you have a paragraph block. It is the paragraph you should target with your style, and your margin will work.

[lasjorg]

Adding an auto margin at that screen size doesn’t really do anything because the element is already at the edge of the screen.

But if you want to center the element using an auto margin you have to give it a width. Use max-width so the element can still shrink.

blockquote {
  text-align: justify;
  font-style: oblique;
  font-size: 1.1rem;
  margin: 0 auto;
  max-width: 540px;
}