Jees K Denny Jees K Denny - 4 months ago 17
CSS Question

2 submit button for 2 forms - The submit button which align horizontally

i have 2 forms that pass all hidden input data to another page. both have submit button which have post method.i am using bootstrap css framework and material bootstrap css design overlap with it. My problem is that 2 submit button aligns vertically like below

submit

submit

i want the 2 submit buttons aligns horizontally like below,

submit submit

what css code i have to apply for these change?

<form action="generate_p.php" method="post" >
<input type="hidden" name="sdat" value="<?php echo $start; ?>"/>
<input type="hidden" name="edat" value="<?php echo $end; ?>"/>
<input type="submit" name="submit" value="EXPORT" class="btn btn-raised btn-success"/>
</form>

<form action="generate_pi.php" method="post" >
<input type="hidden" name="sdat" value="<?php echo $start; ?>"/>
<input type="hidden" name="edat" value="<?php echo $end; ?>"/>
<input type="submit" name="submi" value="EXPO" class="btn btn-raised btn-success"/>
</form>

Answer

You don't need Bootstrap for that. Just simply use style="display:inline-block;" to change your design.

<form action="generate_p.php" method="post" style="display:inline-block;">
             <input type="hidden" name="sdat" value="<?php echo $start; ?>"/>
             <input type="hidden" name="edat" value="<?php echo  $end; ?>"/>
             <input type="submit" name="submit" value="EXPORT"  class="btn btn-raised btn-success"/>
            </form>

<form action="generate_pi.php" method="post" style="display:inline-block;">
             <input type="hidden" name="sdat" value="<?php echo $start; ?>"/>
             <input type="hidden" name="edat" value="<?php echo  $end; ?>"/>
             <input type="submit" name="submi" value="EXPO"  class="btn btn-raised btn-success"/>
            </form>