If you use CSS as below to set a custom line-height in the body, then this causes the direction arrows to be positioned (partly) outside of their containers, which causes them to be clipped too:
body { line-height: 1.5em; }
The fix is to explicitly set the line-height to 1em for the arrows in the flexslider CSS like this:
.flex-direction-nav a:before { line-height: 1em; /* or 40px */ }
If you use CSS as below to set a custom line-height in the body, then this causes the direction arrows to be positioned (partly) outside of their containers, which causes them to be clipped too:
body { line-height: 1.5em; }
The fix is to explicitly set the line-height to 1em for the arrows in the flexslider CSS like this:
.flex-direction-nav a:before { line-height: 1em; /* or 40px */ }