Columns are overlapping

General Discussions
1

I’m working on a footer navigation (at the very bottom) for this site http://dev.tcsi.org/. I used the 5 column row to create this. For some reason when I start to resize the browser for tablet size or something smaller the columns start to overlap causing the links to looking like they’re “bleeding” into each other. I’m wondering how I can get the columns to stay responsive but perhaps create a line break for the links instead of the overlap effect I’m getting now.

Thanks,
Dave

2

Hey David,

Just took a look at your Website and it seems to be caused by the menu module “min-width” that fixes the width to 240px by default. Try the CSS snippet below and see if it’s what you’re looking for. If you want this to apply to that specific row only, you can add a class to the row. e.g., .sample-class .fl-menu .menu.

.fl-module-content .fl-menu .menu {    
    min-width: auto;
}

Thanks!

KC

3

Worked perfect! Thanks, KC.

4

Hey David,

Glad that worked for you, enjoy BB and let us know if you need anything further! :slight_smile:

Thanks!

KC