Guidance on Sidebar styling?

[dsthompson]

Hi. I am trying to get my sidebar styled and have set the parameaters in chrome’s element editor as follows the copied to customizer. All looks good in the element editor but does not come though when transferring the css to the customizer custom css. Wondering what I am missing? Page reference is https://mysalus.org/community/ - screenshot also attached.

.x-sidebar {
width: 27%;
border-style: solid;
border-width: 1px;
padding: 0 10px;
border-radius: 10px;
background-color: #f2f5df;
}

My layout has site max width 1500px, site width 100% and content width 74%. I know I am “overboosting - > 100%” the page width by setting the sidbar wo 27% - as I am trying to remove the whitespace between the left content and right sidebar when content is 74% and sibebar is 23%. Perhaps there is a better way to accomplish?

Thanks as always for you help resolving.

[thai]

Hi There,

The custom CSS for the sidebar looks correct.

I checked your website and I could see that you forgot to close the curly bracket(}) in your custom CSS.

Please find this CSS:

@media(max-width: 800px){
  .about-background .entry-wrap {
    background-color: rgba(191, 127, 63, 0.3);
}

And change to this:

@media(max-width: 800px){
  .about-background .entry-wrap {
    background-color: rgba(191, 127, 63, 0.3);
  }
}

Let us know how it goes!

[dsthompson]

Thanks for the reply and I made the corrections as noted, but the css I provided still has not affected/changed the sidebar. I am also making css changes to accordions which are not changing either - css below, reference page https://mysalus.org/community/#tab-2 (screenshot attached). I am not currently caching pages and cleared the cache of my browser. I also tried adding the !important to the css lines but nothing has worked thus far.

.x-accordion-group {
margin: 0 0 8px;
border: 1px solid #ddd;
border: none;
box-shadow: none;
}

Other suggestions?

[nico]

Hi @dsthompson,

I could see that it is not working because your CSS has an extra or lacking closing or opening brackets.

For example:

Check your other CSS if you closed or open it properly so that your CSS will work.

Let us know how it goes.

Thanks.