SOLVED:4 column footer with plain css

4 column footer with plain css

Oct 10 '19 Comments: 1 Answers: 1

0

I have a 4 column footer that uses float: left;. I want to use the CSS Grid for showing 4 columns without using float:left;. I've tried grid-template-columns: 1fr 1fr 1fr 1fr; with float:left; and it works but when I remove float: left;, it breaks.

Here's the image…

Open Full Question

Answer:

answer re: 4 column footer with plain css

Oct 10 '19

2

• Move grid-template-columns: to .footer-container
• Add display: grid to .footer-container

.footer-container {
  background-color: green; /* Optional */
  display: grid;
  grid-gap: 1rem; /* Optional */
  grid-template-columns: 1fr 1fr 1fr 1fr;
  padding: 1rem; /* Optional */
}

.column {
  background-color: yellow; /* Optional */
  padding: 1rem; /* Optional */
}

…

Open Full Answer