Wanting items in Footer to be equally spaced into thirds


I am reaching out for some help. I would like the three sections in my footer (Hours of Operations, Connect with Us, Bear Coffee Logo) to be evenly spaced on the bottom of my footer. I have each of them in separate divs and am using inline-block to have them align inline with one another. However, the spacing is very off. Please see below… Any help would be greatly appreciated! Thank you in advance!!

You could do one of the following things:

  1. Set a fixed width of 33.33% (basically 100 / 3)
  2. Add flexbox to the footer (if this is the direct parent of those 3 divs, if not, to the direct parent):
footer {
  display: flex;
  justify-content: space-between;

The easiest for what you would need now is to use the first option :slight_smile:


Thanks for the help! I appreciate it!

1 Like