How can I describe a thin horizontal line without using the <hr> tag ?

I tried this:

                .horizontal-line{   border-pinnacle: 1px solid #9E9E9E;   border-bottom: 1px solid #9E9E9E; }

Although information technology works, I desire this line to exist thinner. I tried to reduce 1px to 0.5px, simply it didn't work.

asked Jul xix, 2022 at 14:34

v

  • 0.5px and 0.25px work only fine in my browser.

    Jul 19, 2022 at 14:37

  • also if you want the line to be thinner, just employ border-top or border-bottom, non both (if yous're using as a replacement to <hour>

    Jul xix, 2022 at fourteen:38

  • Don't use border? Use background-color: #9E9E9E; pinnacle: 0.5px;?

    Jul 19, 2022 at 14:39

  • It can depend on your browser and/or device equally to how part CSS pixels render on screens - particularly on those where several screen pixels brand upwardly one CSS pixel. And you may find the resulting width depends on zoom level.

    Jul 19, 2022 at 14:48

  • Brusk paw : <div manner="border-bottom: 1px solid greyness" ></div>

    Oct 13, 2022 at 4:05

3 Answers 3

You can use it but there is not much difference. 

                    .line {   display: inline-block;   width: 100%;   border-top: 0.2px solid red; }  hr {   border-tiptop: 0.2px solid ruddy; }                  
                    <div>   content </div> <span course='line'></bridge> <div>   content </div> <hr> <div>   content </div>

answered Jul 19, 2022 at 14:42

i

  • @VartikaMalguri You could accept my answer if it is working nicely.

    Jul xix, 2022 at fourteen:49

Per this css-tricks word, you could give this a go:

                  .class-name:afterward {     content: " ";     display: cake;     border-bottom: 0.5px solid #9E9E9E; }                
                  <div class="form-name"></div>

answered Jul xix, 2022 at 14:38

There are many ways of doing this. we cant make the size of the borders less than 1px in CSS so I have tried this style. Feel free to alter the opacity.

                .horizental-line{ width: 100%; height: 1px; background-colour: rgb(122, 121, 121); opacity: 0.5;

}

answered Jul 19, 2022 at xiv:44

Not the reply yous're looking for? Scan other questions tagged javascript html css tags visual-spider web-developer-2010 or ask your own question.