Docs

[yhshin1020]

Hey,

I can’t get one section in my webpage to line up with the rest of the site on small devices

Here’s the picture: http://imgur.com/a/NCEp7

How can I do this only on mobile?

On larger screen it is ok because i have centered the text.

Thanks,

[yhshin1020]

This reply has been marked as private.

[Rupok]

Hi there,

It seems you have set width for the heading and paragraph for that particular section :

h2.omtraininghead {
  font-family: "myriad-set-pro_thin";
  font-size: 70px;
  margin-left: auto;
  margin-right: auto;
  width: 500px;
}
#omlessons {
  font-size: 23px;
  margin-left: auto;
  margin-right: auto;
  max-width: 45ch;
  overflow: hidden;
}

You should remove the width and max-width values to get expected result.

Thanks!

[yhshin1020]

This reply has been marked as private.

[Jade]

Hi there,

Try to update this code:

h2.omtraininghead{
  margin-left: auto;
  margin-right: auto;
  width: 500px;
}

to

@media (min-width: 767px) {
    h2.omtraininghead{
       margin-left: auto;
       margin-right: auto;
       width: 500px;
    }
}

[Author]

Posts