The breakpoint component, whose option icon is shown in figure 1, lets you show different content at different screen widths.


Figure 1. the breakpoint option icon


The columns component automatically rearranges content at narrow screen widths, but the breakpoint component gives you finer control over what happens at each width.



Editing a breakpoint component

Inside each breakpoint component are breakpoint bars, as shown in figure 2. The plus sign on the lower bar lets you add options.


Figure 2. the breakpoint bars


Click on the breakpoint bar to open the breakpoint window, as shown in figure 3.


Figure 3. the breakpoint window


The breakpoint window lets you choose whether the content is shown or hidden at each breakpoint.


Click OK to apply the changes to the breakpoint component. Click Cancel to return to the page without changing the breakpoint component.