简体   繁体   中英

How to add a line break with .setattribute()?

I am a beginner programmer which have appended a list of buttons into a div . However, the list of buttons are side by side as shown below here,
在此处输入图片说明
I want a line break after each button so they will be on top of each other instead. My codes to append using .setattribute() are as shown below,

<script>

        var arr = [{"userid": "jim", "title":"help"}, {"userid": "pim", "title":"hello"}]  

        var i;
        $("enquirieswall").empty();
    for (i = 0; i < arr.length; i++) {
                          var a = document.createElement("button");
                          a.setAttribute("href", "#");
                          //a.textContent = arr[i].title;
                          a.innerHTML = arr[i].title.toString();
                          a.setAttribute("class", "btn");
                          a.setAttribute("type", "button");
                          a.setAttribute("onclick", "window.location='enquiriesdetails.php?enid=" + arr[i].enid + "&userid=" +arr[i].userid +"'");
                          $("#enquirieswall").append(a);
                        }
        </script>

        <div id="enquirieswall"></div>

Thanks guys, I picked the CSS solution in the end. I also aligned the buttons and set a fixed width.

<style>
.btn{
    display: block; 
    text-align:center;
    margin:auto;
    width: 80%;
}
</style>

end result:
在此处输入图片说明

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM