Welcome Guest, Not a member yet? Register   Sign In
want to show the button in one line
#1

I want to show three button in same line.
<button type="submit" class="btn btn-primary center-block">Back</button> 
  <button type="submit" class="btn btn-primary center-block">Save</button>
     <button type="submit" class="btn btn-primary center-block">Continue</button>

but it shows one by one.
how to rectify
Reply
#2

That's a Bootstrap question, however it's the center-block that makes it "block" type over "inline" type.
Reply
#3

In you <head>
Code:
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
 <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

PHP Code:
<div class="btn-group">
 
   <button type="button" class="btn btn-primary">Apple</button>
 
   <button type="button" class="btn btn-primary">Samsung</button>
 
   <button type="button" class="btn btn-primary">Sony</button>
</
div
Web Developer
Reply
#4

Hello,
As I read you had a difficulty to add your button in a line There are too many processes to do it.
But the best and easiest method is to do it via CSS code
First, you have to prepare a list as a class like this.

<form method="post" action="nextPage.html" name="nameForm" style="display:inline;">
<input type="hidden" name="value" value="someValue">
<input type="submit" name="submit" value="Submit">
via this code you can do multiple button is a list.
Hope this helps you.
Thanks
Reply
#5

With Bootstrap in your projet:

Code:
<form method="post" action="nextPage.html" name="nameForm">
       <input type="text" name="username">
       <input type="password" name="password">
       <!-- buttons -->
       <div class="form-inline">
           <input type="submit" value="Cancel">
           <input type="submit" value="Save">
           <input type="submit" value="Continue">
       </div>        
   </form>

form-inline gives you the hability to place elements side-by-side.
Simple.
Reply




Theme © iAndrew 2016 - Forum software by © MyBB