CSS for Padding & Font Size


#1

I have been working with Sydney for my site update and am very happy with the results. Sydney gives very professional-looking results. It’s a great theme. Love it!!!

Here is a link to my site:

68meridians.com

I have been modeling it on this site:

http://tenbourne.com

I like Ten & Bourne’s narrow format and larger font. I have attempted to replicate both on my site. I have been using Page Builder to create my pages and have placed CSS in the attributes area of each widget to achieve the narrow format and larger font. Below is an example:

{
padding: 0px 225px;
}
{
font-size:150%;
}

But I have to put it in every widget on every page and it seems pretty inefficient. Another problem is that even though I like the way it looks on my laptop screen, it doesn’t work on my smartphone. Is there a way to apply CSS that would achieve the same results to the entire site?


#2

This should work if I understand correctly what you want to do (it needs to be in a custom CSS plugin):


.so-panel.widget {
    padding: 0px 225px;
    font-size:150%;
}
@media only screen and (max-width: 991px) {
  .so-panel.widget {
      padding: 0;
      font-size:100%;
  }
}


#3

Awesome! That’s exactly what I wanted.

I’ve been searching for an answer to this for days. Thanks so much for the help.

PS - I like your avatar.


#4

Glad it worked. Feel free to rate the theme if you enjoy it: https://wordpress.org/themes/sydney/ :slight_smile: