I would like to get this result in CSS

img1

I have for now this:

img2

I don't understand how I can center the elements and pass a line in CSS?

I wanted to use a margin: auto, but I think that's not a good practice?

Here is the code.

Thanks

CodePudding user response：

To center elements in CSS you can do a few things, but for text I use
<p style="text-align:center>Text</p>
(You can replace p with any tag that uses text)

---

For images I just put the images in between a <center> tag.

<center>
<img src="www.example.com">
</center>

---

If you dont want to have to type that all out every time you send something, just type

body {
text-align:center
}

inside a style.css folder and then connect it to the file you want to style.
That is what I usually use to center images and text.
I am not entirely sure what you mean by "pass a line", but if you mean to make a line then you can use

<hr>

CodePudding user response：

You can wrap the elements in div

  <div >
    <span >User : Toto </span>
    <span >Votre dernière connexion : 09/12/2021 à 12:41:34</span>
  </div>

and add this style for parent

.text-container {
  width: 100%;
  text-align: center;
}