Enzo_UK Posted November 8, 2016 Share Posted November 8, 2016 Can someone please point me in the right direction, I am trying to get a 'Qty' input box attached to the left side of my 'Add To Cart' button, by using the "input-group" class. The input box part seems to resize as screen size changes, and the button stays the same width, but at certain screen sizes the input box is so narrow you cant actually see the number in it. This is how I am doing it at the moment: <div class="col-xs-4 text-right"> <div class="input-group"> <?php echo tep_draw_input_field('cart_quantity', '1', 'maxlength="2"');?> <span class="input-group-btn"> <?php echo tep_draw_hidden_field('products_id', $product_info['products_id']) . tep_draw_button(IMAGE_BUTTON_IN_CART, 'fa fa-shopping-cart', null, 'primary', null, 'btn-success'); ?> </span> </div><!-- /input-group --> </div><!-- /col-xs-4 text-right --> Any help greatly appreciated, thanks in advance. Link to comment Share on other sites More sharing options...
oscMarket Posted November 8, 2016 Share Posted November 8, 2016 Stackoverflow possible solution : http://stackoverflow.com/questions/19934647/resize-buttons-responsively-in-bootstrap Link to comment Share on other sites More sharing options...
Enzo_UK Posted November 8, 2016 Author Share Posted November 8, 2016 Thanks for the link, I have had a look at that but seems more about making the button part resize responsively. I am after a way to make the 'Input Box' a fixed width, so it doesn't resize. Link to comment Share on other sites More sharing options...
♥14steve14 Posted November 8, 2016 Share Posted November 8, 2016 Have a read of the thread here. It may help or may indeed do what you are laready trying to do. No need to reinvent the wheel unless you have to. http://www.oscommerce.com/forums/topic/398250-bootstrap-quantity-box/ REMEMBER BACKUP, BACKUP AND BACKUP Link to comment Share on other sites More sharing options...
oscMarket Posted November 8, 2016 Share Posted November 8, 2016 here is your problem: <div class="col-xs-4 text-right"> try <div class="col-xs-6 text-right"> And change all the other columns what are within the container element according to a total of 12 grids. Link to comment Share on other sites More sharing options...
Enzo_UK Posted November 8, 2016 Author Share Posted November 8, 2016 I think I have got something I am happy with now, and have learnt something new... have ended up specifying different widths for XS, SM, LG... so have ended up with 3,3,6 on XS... 4,4,4 on SM... 5,4,3 on LG. Link to comment Share on other sites More sharing options...
Enzo_UK Posted November 8, 2016 Author Share Posted November 8, 2016 Just incase anyone else reads this, and uses any of the code above.. One change I made was to the above was adding the 'number' restriction on the input field, to stop it from sending other characters, which will trigger the added to cart message in the cart, but dont actually add an item. <?php echo tep_draw_input_field('cart_quantity', '1', 'maxlength="2"', 'number');?> Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.