How to align the divs vertically with css?

Question

I would like for the divs to all be on one line. Can someone tell me what I am doing wrong here?* `
.main{ width: 20vw; margin: auto; } .border1{ margin-left: auto; height: 5px; width: 33%; background-color: #f5c70a;
} .border2{ margin: auto; height: 5px; width: 33%; background-color: #66ABC7; } .border3{ margin-right: auto; width: 33%; height: 5px; background-color: #5a0a60; } ` enter image description here

Welcome to Stack Overflow! Questions seeking code help must include the shortest code necessary to reproduce it **in the question itself** preferably in a [**Stack Snippet**](https://blog.stackoverflow.com/2014/09/introducing-runnable-javascript-css-and-html-code-snippets/). See [**How to create a Minimal, Reproducible Example**](http://stackoverflow.com/help/reprex) — Paulie_D, Dec 21 '21 at 17:27

score 0 · Answer 1 · answered Dec 21 '21 at 17:28

0

you can do like this:

CSS:

.parent {
   display: flex;
   align-items: center;
}

HTML:

<div class="parent">
// ... element will be centered vertically here
</div>

answered Dec 21 '21 at 17:28

Zain Khan

1 Answers1