css - Display two UL elements side by side, centered vertically and horizontally -
i've been struggling while , couldn't find right solution. at bottom of page i've footer that's full width. inside want display list of messages , right next left icon, in case it's font awesome icon. message list needs centered both vertically , horizontally , icon has centered vertically. i've tried doing using ul elements display: inline-block , text-align: center. messages displays correctly icon stuck in same place no matter size of container. here's i've far: <div class="error-message-container"> <ul class="error-message-bell"> <li aria-hidden="true" class="fa fa-bell-slash-o"></li> </ul> <ul class="error-message-list"> <li>lorem ipsum dolor sit amet, consectetur adipiscing elit</li> <li>consectetur adipiscing elit</li> <li>lorem ipsum dolor sit amet</li> <li>lorem ipsum dolor sit ame