Question 37337 in Jquery Question posted in
The official Jquery Api Documentation can be found here.

Want to create a div line between 2 other divs – Jquery

enter image description hereI want to create a separating line between 2 divs. But the line shows at the end of last div.

.line {
  display: inline-block;
  width: 2px;
  height: 20px;
  background: black;
}
<div class="col">
  <div class="info_badge" id="teams_footer"></div>
  <div class="line"></div>
  <div class="info_badge" id="coinventor_footer">hello</div>
</div>
Tags:

2

Answers


  1. 0

    Did you tried using <hr/> between the two divs like this?

    <div></div>
<hr/>
<div></div>

    And then add styles to it:

    <hr style="width:50%;text-align:left;margin-left:0">
    Login or Signup to reply.
  2. 0

    You can achieve your result without the extra <div> element

    <div class="col">
    <div class="info_badge" id="teams_footer"></div>
    <div class="info_badge" id="coinventor_footer">hello</div>
</div>

    .col > div:not(:last-child)::after
{
    content: "";
    display: inline-block;
    width: 2px;
    height:20px;
    background:black;
}
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search