Hi!

I am returning to Web design after many years away, so this is a very basic question.
I have an issue where a design changes unexpectedly at a break point.
I have tried moving between the 2 and looking at the layout settings.

I see that in the Display and Flex Layout sections there is an area of 3 dots. The middle one is changing from black to blue, and some fields get a blue border to the left.
Please can you tell me what these blue settings are telling me, and how do I get to change them?

thanks in advance

The basic idea can be illustrated by creating a completely new project, adding a container element, and playing in the Styles section for that element as follows.

A. Set the Apply Styles as 'To selected classes'. That will have a blue line at the left.

1. Ensure that the Reset section says 'No styles to reset'. If it doesn't, in that box select All Breakpoints > All Styles. That means that all the styles are set to their defaults for that element and that selected class. No blue dots will show.
2. Ensure that the Layout button is selected, and reduce each of the sections beneath it to a single line by clicking if necessary on the triange icon at the left of the heading of each section.
3. Expand one of the sections and change one of the settings in it. A blue line will appear to the left of the changed setting. Reduce the Display section back to a single line, and the blue dot will appear, indicating that there is a non-default 'To selected classes' setting in that section.

B. Set an ID in the top section of the Styles panel and set the Apply Styles as 'To this element id only'. That will have a Yellow line at the left. Then repeat items 1-3 above. A yellow dot will appear.

C. Set the Apply Styles as 'To all elements of this type'. That creates a different colour line at the left, and repeating the exercise above will produce the different colour dot.

The coloured line at the left of a setting indicates the Apply Styles setting.
The coloured dot indicates for a collapsed section that there are non-default settings there and the Apply Styles setting involved.

Frank

Hello there

Just as an additional bit of information, which would help other users in the future, for any other assistance, would be to mention a couple of things
1/ which framework of the four available you are using, just in-case it happens to a different one to the foundation one you are asking about this time (the clue being the mention of 2 breakpoints.) also you seem to have used either a template or a ready made component, it would also help to mention which template or component,

Franks explanation is good and covers everything you may need to know to get on track, but if we knew the template or the component, perhaps any further explanations would be more specific to that template or component.

Just a tip for future use.

Finally The number of dots indicates that there are more than 1 custom settings for that element.

Finally finally, clicking on the little ? on the right takes you to the CC site article about that componnent