Changing background colour of in text boxes

Hi all

Apologies, I am completely new to this. I have set up a new site and am wondering how i might be able to change the colour of the text boxes on my website: http://intelhealth.care/

Where do I need to go to edit css. Can anyone provide me with some simple instruction or code to get me started!?!

Many thanks in advance for any assistance.

You can change content area background color by adding this simple CSS code to Appearance >> Theme Options >> Other >> Custom CSS. Make sure to change background color code to one that you want to use. This example with turn it into black.

.post-inner-content {
  background-color: #111;
  border: none !important;
}

Brilliant, thank you so much!

Could you also advise how I can make the box smaller or larger?

Many thanks again for you help and patience. I know I need to read up on this stuff. Any ‘Dummies guide’ links appreciated!

You can change content width by adding this code to the same Custom CSS I mentioned earlier. This code will make content width to 1300px but you can tweak this value to get the result you were looking for.

@media (min-width: 1200px) {
  .container.main-content-area {
    width: 1300px;
  }
}

There are many online courses available to learn some CSS basics. I am not sure how well Treehouse CSS courses are but I have followed their other guides and they are awesome. Here you can read more information about CSS basic courses.

Thanks again… and for the course tips…

I have also tried to edit the height by adding the following, but it doesn’t seem to work…

@media (min-width: 1000px) {
  .container.main-content-area {
    width: 1000px;
  }
}
@media (min-height: 400px) {
  .container.main-content-area {
    height: 400px;
  }
}

Do I have to include the height code within the code used for the width?

I WILL check out the courses at some point :wink:

Noup, that’s not how it works with height and also selector you are using is not the right one.

Here is an example with height:

@media (min-width: 1000px) {
	.container.main-content-area .post-inner-content {
	  height: 1000px;
	}
}

Definitely need to get some basics in place :slight_smile:

Thank you

That helped me a lot. But how do I change the background color of the side bar? I use sparkling theme.

Tks in advance

@mercadodosmascotesgmailcom This is old topic so to help us keep support thread separates could you please create your own thread for your question here https://colorlibsupport.com/c/sparkling/ instead of replying on others thread as it makes the thread messy and hard to read.

If you want to you can also add reference of this thread in your newly created thread.

We would be more than happy to help you on your new thread.