reflectiveoffice Posted September 15, 2014 Share Posted September 15, 2014 Hi, My Add to cart block is misaligned. The +/- are not on the same line and also the Add to cart button is not centralised. See here: http://prntscr.com/4n6etd Any ideas how I change this? Many thanks in advance. Link to comment Share on other sites More sharing options...
osdznr14mm Posted September 16, 2014 Share Posted September 16, 2014 Hi, Is there a demo of the theme you're using somewhere so that we can look at the css code? Looking at your screenshot, probably you don't have enough width in the containing element to fit the + & - boxes on the same line so try to remove some padding or margins on the containing light gray box. Or you can decrease the width on the amount box. To center the cart box, if it's a div I use {margin: 0 auto} and set a defined width on it like so: #box { position: relative; width: 100px; margin: 0 auto; } I usually need to add position: relative to get it to work, but you can try leaving it out first. 1 Link to comment Share on other sites More sharing options...
reflectiveoffice Posted September 16, 2014 Author Share Posted September 16, 2014 Thanks osdznr14mm - very helpful advice! Which file/css do I edit to change the containing light gray box? The theme is just the default bootstrap but converted into 3 columns as per this thread: http://www.prestashop.com/forums/topic/317409-tutorial-classic-3-columns-theme/ Link to comment Share on other sites More sharing options...
osdznr14mm Posted September 16, 2014 Share Posted September 16, 2014 Hi reflectiveoffice, I'm still on 1.5.6 so I don't have that theme. I know I can download it but I'd rather tell you how to find the css file. If you can open your site in Chrome, if you right click on the element in question, then a box opens at the bottom w/ all the code. In the right hand column it lists the name of the css file with link, the styles, the line number, etc. So you can click around to find the various css. You can't edit it for real in Chrome, it only gives you a preview if you make edits, but that's still helpful. You have to make the actual changes in the css file in a text editor. Firefox also has this feature. 1 Link to comment Share on other sites More sharing options...
reflectiveoffice Posted September 16, 2014 Author Share Posted September 16, 2014 Hi osdznr14mm, Once again many thanks for your help. I'll try that and hopefully make the necessary edits. 1 Link to comment Share on other sites More sharing options...
Joeylee Posted November 28, 2014 Share Posted November 28, 2014 Hi osdznr14mm, Once again many thanks for your help. I'll try that and hopefully make the necessary edits. Hello, You can modify "product.css" @ Line 691 #quantity_wanted_p input { width: 70px; /* modify it, in my case, resize from 78px to 70px */ height: 27px; padding: 0 6px; float: left; border: 1px solid #d6d4d4; line-height: 27px; } Prestashop version : 1.6.0.9 Best Regards, Joey Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now