skip to Main Content

I just want to ask how can add space between these button inside a border because
or does not work in html. Html code below:

<div class="container2">
    <button class="accordion">What is an alumni website?</button>
    <div class="panel">
        <p1>An alumni website is a platform designed for graduates of a specific educational institution to connect and engage with one another. It provides a space for alumni to stay in touch, share news, and participate in events and programs organized by the institution.</p1>
    </div>
    <button class="accordion">Who can access an alumni website?</button>
    <div class="panel">
        <p1>Typically, alumni websites are only accessible to graduates of the specific educational institution. In some cases, access may also be granted to current students, faculty members, and staff of the institution.</p1>
    </div>
    <button class="accordion">What are the benefits of joining an alumni website?</button>
    <div class="panel">
        <p1>Joining an alumni website can provide a range of benefits, including the ability to network with other graduates, stay informed about news and events related to the institution, access career resources and job postings, and participate in mentoring or volunteer programs.</p1>
    </div>

I just drop the output also. I tried <br> or </br> tag but it doesn’t work.

enter image description here

2

Answers


  1. You could do this by adding margin or padding. How about <button class='accordion' style='margin-bottom:0.5rem'>...

    You could also make this happen for all buttons by adding

    button.accordion {
        margin-bottom: 0.5rem;
    }
    

    to the css stylesheet for the page

    Login or Signup to reply.
  2. I really would not recommend <br> , It’s much easier and more flexible to use CSS margins instead.

    Example:

    button.accordion{
         margin: 10px 0;
    }
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search