Modifying CSS in WordPress theme – CMS & WordPress – SitePoint Forums

May 23, 2024

21 1 minute read

Untitled design6 — cf11b3ed553d6c359d3dcc08377cc4b121fe8bf0.png

Using vw units might be a better option to achieve a responsive result?

Then I must modify like this?

body {
font-size : 62.5%;
font-family : orkneyregular, Orkney, Raleway, Sans-Serif;
background : url("images/bg.jpg") top center no-repeat #bcc5c1 !important ;
color : #000;
text-align : justify;
margin : 0 0 20px 0;
padding : 0;
}

p {
font-family : orkneyregular, Orkney, Raleway;
font-size : 20px;
font-style : normal;
text-align : justify;
}

Can I combine the styles of <body> and <p> into one, or do they each belong to a different element? If yes, how would it look?

Once these changes are made, can I remove the inline CSS from the example post?

Do you check in dev tools or is only at eye checking?
In principle, you can see that the titles are defined with descending sizes, unless another rule is affecting them.

h1 {
  font-size: 4.8em;
  font-family: orkneyregular, Orkney, Raleway;
  text-transform: uppercase;
  padding: 0 0 0 39px;
}

h1,
h1 a,
h1 a:hover,
h1 a:visited,
#header .description {
  text-decoration: none;
  color: #000;
}

h2 {
  font-size: 2.8em;
  font-family: orkneyregular, Orkney, Raleway;
  font-weight: normal;
  line-height: 1em;
  padding-bottom: 9px;
}

h2,
h2 a,
h2 a:visited,
h3,
h3 a,
h3 a:visited {
  font-family: orkneyregular, Orkney, Raleway;
  color: #cc0000;
  text-decoration: none;
}

#sidebar h2,
#wp-calendar caption,
cite {
  text-decoration: none;
}


h3 {
  font-size: 2.5em;
  line-height: 1em;
  font-weight: normal;
}

H4 {
  font-size: 2.4em;
  font-family: orkneregular, Orkney, Raleway;
  color: #000;
  line-height: 1em;
  padding: 0px;
}

H4.footerwidget {
  padding-top: 20px;
}

H5 {
  font-size: 2em;
  font-family: orkneyregular, Orkney, Raleway;
  color: #000;
  line-height: 1em;
  padding: 12px 0 12px 0;
}


H6 {
  font-size: 1.6em;
  font-family: orkneyregular, Orkney, Raleway;
  color: #000;
  line-height: 1em; 
  padding: 0px 0 16px 0;
}

Source

May 23, 2024

21 1 minute read