Hi,
We inspected your site and it seems like the problem is caused by the custom CSS styles that you or your developers placed on the site. Here is the details.
Your site styles contain the following code:
/* store widgets */
#content #text-10, #content #text-69, #content #text-9, #content #text-5, #content #text-4 {
padding: 0px 15px 15px 15px;
margin: 0px 14px 0px 14px;
clear: both;
height: 100%;
overflow: hidden;
border: 1px solid #080034;
background: url('images/bar.gif') repeat-x left top;
background-color: #fff;
}
/* end store widgets */
File: https://alpacameadows.com/wp/wp-content/themes/alpacameadows/style.css
Line: 890
This code makes the sidebar widget look the way it looks (white background and purple header). In the beginning of the code, you see the elements that it applies to: #content #text-10, #content #text-69, #content #text-9, #content #text-5, #content #text-4 . In fact, those are the same element (sidebar widget), but it is marked with different IDs on different pages for some reason. Those different IDs is the root cause of the problem, because some of the new pages or post that you create assign different IDs to the same element, and on the new pages (like the blog post you mentioned), the sidebar widget is marked with a new ID, which break the CSS I mentioned.
There are two ways to fix that:
1) [Recommended] . Change the code of the sidebar widget in your WordPress site to make it appear with the same ID on each page. In this case, every new page or post you create on your site will inherit the styles your already have and the sidebar widget will look the same everywhere. This requires programming skills, so you will probably need help of a developer here. If you know the author of this theme or this particular widget, you should ask them to fix that.
2) Quick fix for the particular blog post page. To add the blog post you just created to the list of the ‘proper’ pages, you can add a small fix to the CSS code I posted above. Just change the first line of it so it looks this as follows:
#content #text-10, #content #text-69, #content #text-9, #content #text-5, #content #text-4, #content #text-130 {
So the whole code blok will look as follows:
/* store widgets */
#content #text-10, #content #text-69, #content #text-9, #content #text-5, #content #text-4, #content #text-130 {
padding: 0px 15px 15px 15px;
margin: 0px 14px 0px 14px;
clear: both;
height: 100%;
overflow: hidden;
border: 1px solid #080034;
background: url('images/bar.gif') repeat-x left top;
background-color: #fff;
}
/* end store widgets */
You can edit the styles.css file to change this code in your WordPress admin backend (Appearance -> Editor)
Hope this helps.
