Retaining Widgets Original Formating

Which theme are you using? If I can try the theme and reproduce the problem, I may be able to suggest something to solve.

Hello and thanks for the quick response.
I am using Elegant Themes’ ‘Foxy’ Theme.

The following page is using the Responsive Column Widgets:
https://aelled.com/contact-us/

The following page is an example of the sidebar in its normal form.
https://aelled.com/locations/

As you can see, the container doesn’t have the same header look and feel. One of the widgets has horizontal lines outside of the box.

Thank You.

I see. This is a theme specific issue. You need to adjust output elements.

Try this.

1. Go to Dashboard -> Appearance -> Responsive Column Widgets -> New / Edit.

2. Find the option named, Starting Tag for Box Title and replace the exisitng value with

<h4 class="widgettitle">

3. Find the option named Ending Tag for Box Title just below the previous option and replace the existing value with

</h4>

4. Put this CSS rules in the option named CSS Rule.

.responsive_column_widgets .widget h4.widgettitle {
  margin: 0 0 26px;
}

Closer, but still a few formatting issues.
https://aelled.com/contact-us/

Have you tried what I suggested? I don’t see your web site has changed.

Maybe you may need to disable caching plugin if you are using one. Also Responsive Column Widgets has caching ability and make sure to set 0 for the Caching Duration option.

Follow Up:
Thanks a great deal for looking into the issue.
I like the functionality of the plug-in, its exactly what I need.
I’d like to buy the Pro version for additional layouts.
But, the formatting issues are a bit of an issue still.
The “Send Us a Message” content should be indented a few spaces.
The “Check Us Out On Facebook” content should be indented a few spaces.
The “Keep In Touch” content lines still display outside the box.

Caching Duration Set to 0
Turned Super Cache Off

Yes, the code worked for most of the issues.
Its a odd thing that I only see the corrected page when I view it from the Admin panel and not the live site.

Still I don’t see your site being changed but I understand your issue of indentation of the widget contents.

Try adding this in the CSS Rule option.

.responsive_column_widgets .textwidget {
	padding: 0em 2em;
}

Where 2em is the degree of the indents.

Update:

This may be better since it also applies to the other widgets.

.responsive_column_widgets_box .widget {
    padding: 0 2em;
}

In that case, the previously suggested CSS Rule above should be replaced with this one. Also you may want to remove the CSS rule of the h4 tag previously suggested.

Thanks again.
I think you’ll be able to see the offending page now at:
https://aelled.com/contact-us/
So far, a great improvement from the beginning.

I as using the text widget specific CSS code.
The second suggestion pulled the header with it and changed its appearance.
I have noticed a few things with the formatting inside each of the three widgets.
The content of the widget often goes outside the box on the right side and isn’t quite as responsive as the widget box itself.
Is there a know issue with this?

The content of the widget often goes outside the box on the right side and isn’t quite as responsive as the widget box itself.

If you are talking about the textarea of the contact form, it is like so in your sidebar as well. So it is not the issue of the plugin but the theme.

Though if you want to fix the textarea not to stick out the box, you may add this CSS rule.

.widget textarea {
	width: 100%;
}

Is there a know issue with this?

No. You should try to see if the same thing occur with the WordPress default theme.

Okay, thanks once again.
I’m trying to replace the widget on the far right “Keep In Touch”, with a new set of two text widgets.

Is there a way to tell Responsive Column Widgets to use Widget #1 in the first column, Widget #2 and #3 in the second column and Widget #4 in the third column?

Also, If I wanted to indent the content of the Facebook Like Box, what would be the equivalent code to what I’m using for the textbox

.responsive_column_widgets .textwidget {
padding: 0em 2em;
}

Is there a way to tell Responsive Column Widgets to use Widget #1 in the first column, Widget #2 and #3 in the second column and Widget #4 in the third column?

If the question is different from the initial question, let’s create another topic. That way, future visitors can easily find information they are looking for.

Also, If I wanted to indent the content of the Facebook Like Box, what would be the equivalent code to what I’m using for the textbox

I’d suggest the second approach suggested above because if you want to add more widgets, you’ll have to think about the indentation again.

As you said, the second suggestion may cause the widget title to exceed the width of the container but it can be adjusted after that. So let me know if you have done this point.

Thanks for your help resolving the issues raised.