+- CodeIgniter Forums (https://forum.codeigniter.com)
+-- Forum: General (https://forum.codeigniter.com/forumdisplay.php?fid=1)
+--- Forum: Lounge (https://forum.codeigniter.com/forumdisplay.php?fid=3)
+--- Thread: want to show the button in one line (/showthread.php?tid=71493)
want to show the button in one line - kvanaraj - 08-19-2018
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
RE: want to show the button in one line - Pertti - 08-20-2018
That's a Bootstrap question, however it's the center-block that makes it "block" type over "inline" type.
RE: want to show the button in one line - Php - 08-20-2018
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>
RE: want to show the button in one line - Afflospark - 04-18-2019
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
RE: want to show the button in one line - JLDR - 04-19-2019
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.