I am loosing the responsiveness of my web site as the screen narrows

I am having problems with the first two sections (rows) of my web site in that they are loosing their responsiveness as the screen narrows. The top of the second section named “Connect with me” seems to overlap the section above it, which is my home row.

I also loose responsiveness in the “Approach” section in that the text in the bordered boxes expands outside the the boxes.

The issues are appearing when the screen width is smaller than 678px

The other sections which could be best described as single columns seem to work fine as the screen width reduces. The problems seem to be related o page rows containing more than one column

Here is the URL to my site https://fortelaw.ca

Hi,

The section Connect with me, which is built with the SO widget bundle seems to be lacking some responsive styling. Perhaps have a look at the options, see if you need to toggle something. I can’t test right now but I will later and if there’s a problem with the widget, I’ll report it to the guys at Siteorigin.

The other section seems to look fine. Is this resolved?

Hi Vald,

I’ve toggled about every option in the Connect With me SO Features widget but the problem with responsive styling remained. I also tested the widget on the SO North theme and experienced the same problems with responsive styling.

The other section named “Approach” also has responsive styling issues that remain unresolved. In this situation as the screen shrinks the text in the bordered boxes expands out of the boxed area and at some point as the screen width continues to shrink the text moves back into the box borders.

The responsive styling problem seems to arrear when there is more than one column in the row.

I have put a support request into SO to see what they have to say about it.

Thank you,

Cliff G.

Hi Vald,

The issues regarding responsive styling are definitely related to the SO Widget.

Thank you for your help.

Cliff G.