• 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
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 | (Skype : shakil.ahmed572)
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


Digg   Delicious   Reddit   Facebook   Twitter   StumbleUpon  


Users browsing this thread:
1 Guest(s)


  Theme © 2014 iAndrew  
Powered By MyBB, © 2002-2019 MyBB Group.