Similar Posts

Subscribe
Notify of
11 Answers
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
regex9
1 year ago

The line left next to the text I value as a decorative element, so I would just be ::before– Use peseudo element for this.

Example:

p::before {
  border-top: 3px solid;
  content: '';
  display: inline-block;
  margin-right: 20px;
  margin-top: 5px;
  vertical-align: top;
  width: 50px;
}

Instead, a separation line (hr) to draw (as has already been proposed) would, in my opinion, be wrong because of its content.

FaTech
1 year ago

You can also use the


element. Then you have a straight line and no rectangle with Border.

Edit: Not thinking about it. Depending on the situation, a :before or ::after can work. To this end give the main element position relative, then before apply and set absolute before with position. It’s wonderful.

NackterGerd
1 year ago
  • <= 1 %
  • Borderline
  • Svg
  • Bitmap
  • Special characters and corresponding font
Rolajamo
1 year ago

I’d see the line as a whole container and just fill it.

NackterGerd
1 year ago
Reply to  Rolajamo

container you do not need an extra

geheim007b
1 year ago

border: 2px solid black;

border radius: 5px;

NackterGerd
1 year ago
Reply to  geheim007b

The LINIE

So no radius

And if with Border, then Borderline only top

geheim007b
1 year ago
Reply to  NackterGerd

“How do I make these lines? (On the middle left next to the text)”

there is this box with the rounded corner, so I assumed that it refers to

NackterGerd
1 year ago

No

The line left next to the text 🤣

Not a box around the text!

But in the small box with the round corners you see the line next to the text

guteantwort626
1 year ago

With a CSS-Pseudo element