[Skip to main content](#vessel-content) # Product Div Display - width of divs and screen ## - **[huggy59](/forum/user/33891-huggy59 "View huggy59's Profile")** - [![huggy59's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/33891-huggy59 "View huggy59's Profile") Topic Author - [ Offline](/forum/user/33891-huggy59) Less More - Posts: 5 - Thank you received: 0 - - 12 years 2 months ago [\#168653](#168653) by [huggy59](/forum/user/33891-huggy59 "View huggy59's Profile") *[Product Div Display - width of divs and screen](/forum/26-product-category-display/870570-product-div-display-width-of-divs-and-screen#168653 "-- HikaShop version -- : 2.3.2 -- Joomla version -- : 3.3.3 -- PHP version -- : 5.3.27 -- Browser(s) name and version -- : any -- Error-message(debug-mod must be tuned on) -- : no error I'm new to Hikashop and purchased the Essential version for this client web site build. We have a fairly minimalist set of products (only 6) and I'm trying to get the 3-col x 2-row layout on the product listing to look like one of the standard Hikashop layouts. That is, the template has Bootstrap and I've turned that on in Hikashop, and it is working properly to reformat the layout as the screen sizes change, but I have one issue I can't seem to fix. On a standard desktop display, I can't make the product divs all the same size, and take up 100% of the space in the content div. See the screenshot attached. What I'd like is three columns of equally-sized (width) product boxes, with the entire content area filled. More like a 100% width table with three equal-size columns. What am I missing that will make this work? Thanks")* was created by *[huggy59](/forum/user/33891-huggy59 "View huggy59's Profile")* -- HikaShop version -- : 2.3.2 -- Joomla version -- : 3.3.3 -- PHP version -- : 5.3.27 -- Browser(s) name and version -- : any -- Error-message(debug-mod must be tuned on) -- : no error I'm new to Hikashop and purchased the Essential version for this client web site build. We have a fairly minimalist set of products (only 6) and I'm trying to get the 3-col x 2-row layout on the product listing to look like one of the standard Hikashop layouts. That is, the template has Bootstrap and I've turned that on in Hikashop, and it is working properly to reformat the layout as the screen sizes change, but I have one issue I can't seem to fix. On a standard desktop display, I can't make the product divs all the same size, and take up 100% of the space in the content div. See the screenshot attached. [ ![hikashop1.jpg](/forum/attachment/19188) ](/forum/attachment/19188 "hikashop1.jpg") What I'd like is three columns of equally-sized (width) product boxes, with the entire content area filled. More like a 100% width table with three equal-size columns. What am I missing that will make this work? Thanks - [ ![hikashop1.jpg](/forum/attachment/19188) ](/forum/attachment/19188 "hikashop1.jpg") [ ](/forum/attachment/19188?download=1 "hikashop1.jpg") Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI2LXByb2R1Y3QtY2F0ZWdvcnktZGlzcGxheS84NzA1NzAtcHJvZHVjdC1kaXYtZGlzcGxheS13aWR0aC1vZi1kaXZzLWFuZC1zY3JlZW4/dG1wbD1tYXJrZG93bg==) or [Create an account](/component/users/registration?Itemid=101) to join the conversation. - **[Jerome](/forum/user/80-jerome "View Jerome's Profile")** - [![Jerome's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar80.png)](/forum/user/80-jerome "View Jerome's Profile") - [ Offline](/forum/user/80-jerome) - HikaShop core developer Less More - Posts: 26394 - Thank you received: 4078 - - [](http://obsi.dev) - 12 years 2 months ago [\#168663](#168663) by [Jerome](/forum/user/80-jerome "View Jerome's Profile") Replied by *[Jerome](/forum/user/80-jerome "View Jerome's Profile")* on topic *[Product Div Display - width of divs and screen](/forum/26-product-category-display/870570-product-div-display-width-of-divs-and-screen#168663 "-- HikaShop version -- : 2.3.2 -- Joomla version -- : 3.3.3 -- PHP version -- : 5.3.27 -- Browser(s) name and version -- : any -- Error-message(debug-mod must be tuned on) -- : no error I'm new to Hikashop and purchased the Essential version for this client web site build. We have a fairly minimalist set of products (only 6) and I'm trying to get the 3-col x 2-row layout on the product listing to look like one of the standard Hikashop layouts. That is, the template has Bootstrap and I've turned that on in Hikashop, and it is working properly to reformat the layout as the screen sizes change, but I have one issue I can't seem to fix. On a standard desktop display, I can't make the product divs all the same size, and take up 100% of the space in the content div. See the screenshot attached. What I'd like is three columns of equally-sized (width) product boxes, with the entire content area filled. More like a 100% width table with three equal-size columns. What am I missing that will make this work? Thanks")* Hi, Your template is not compatible with Bootstrap 2 ; there is no CSS rule for "span4". So the div blocks does not have the 33% width like they should have with bootstrap. Regards, --- Jerome - Obsidev.com HikaMarket & HikaSerial developer / HikaShop core dev team. Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI2LXByb2R1Y3QtY2F0ZWdvcnktZGlzcGxheS84NzA1NzAtcHJvZHVjdC1kaXYtZGlzcGxheS13aWR0aC1vZi1kaXZzLWFuZC1zY3JlZW4/dG1wbD1tYXJrZG93bg==) or [Create an account](/component/users/registration?Itemid=101) to join the conversation. - **[huggy59](/forum/user/33891-huggy59 "View huggy59's Profile")** - [![huggy59's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/33891-huggy59 "View huggy59's Profile") Topic Author - [ Offline](/forum/user/33891-huggy59) Less More - Posts: 5 - Thank you received: 0 - - 12 years 2 months ago [\#168703](#168703) by [huggy59](/forum/user/33891-huggy59 "View huggy59's Profile") Replied by *[huggy59](/forum/user/33891-huggy59 "View huggy59's Profile")* on topic *[Product Div Display - width of divs and screen](/forum/26-product-category-display/870570-product-div-display-width-of-divs-and-screen#168703 "-- HikaShop version -- : 2.3.2 -- Joomla version -- : 3.3.3 -- PHP version -- : 5.3.27 -- Browser(s) name and version -- : any -- Error-message(debug-mod must be tuned on) -- : no error I'm new to Hikashop and purchased the Essential version for this client web site build. We have a fairly minimalist set of products (only 6) and I'm trying to get the 3-col x 2-row layout on the product listing to look like one of the standard Hikashop layouts. That is, the template has Bootstrap and I've turned that on in Hikashop, and it is working properly to reformat the layout as the screen sizes change, but I have one issue I can't seem to fix. On a standard desktop display, I can't make the product divs all the same size, and take up 100% of the space in the content div. See the screenshot attached. What I'd like is three columns of equally-sized (width) product boxes, with the entire content area filled. More like a 100% width table with three equal-size columns. What am I missing that will make this work? Thanks")* Can I add the required span4 code? Where in your documentation does it say Bootstrap 2 is required? I cannot find it. Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI2LXByb2R1Y3QtY2F0ZWdvcnktZGlzcGxheS84NzA1NzAtcHJvZHVjdC1kaXYtZGlzcGxheS13aWR0aC1vZi1kaXZzLWFuZC1zY3JlZW4/dG1wbD1tYXJrZG93bg==) or [Create an account](/component/users/registration?Itemid=101) to join the conversation. - **[huggy59](/forum/user/33891-huggy59 "View huggy59's Profile")** - [![huggy59's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/33891-huggy59 "View huggy59's Profile") Topic Author - [ Offline](/forum/user/33891-huggy59) Less More - Posts: 5 - Thank you received: 0 - - 12 years 2 months ago [\#168707](#168707) by [huggy59](/forum/user/33891-huggy59 "View huggy59's Profile") Replied by *[huggy59](/forum/user/33891-huggy59 "View huggy59's Profile")* on topic *[Product Div Display - width of divs and screen](/forum/26-product-category-display/870570-product-div-display-width-of-divs-and-screen#168707 "-- HikaShop version -- : 2.3.2 -- Joomla version -- : 3.3.3 -- PHP version -- : 5.3.27 -- Browser(s) name and version -- : any -- Error-message(debug-mod must be tuned on) -- : no error I'm new to Hikashop and purchased the Essential version for this client web site build. We have a fairly minimalist set of products (only 6) and I'm trying to get the 3-col x 2-row layout on the product listing to look like one of the standard Hikashop layouts. That is, the template has Bootstrap and I've turned that on in Hikashop, and it is working properly to reformat the layout as the screen sizes change, but I have one issue I can't seem to fix. On a standard desktop display, I can't make the product divs all the same size, and take up 100% of the space in the content div. See the screenshot attached. What I'd like is three columns of equally-sized (width) product boxes, with the entire content area filled. More like a 100% width table with three equal-size columns. What am I missing that will make this work? Thanks")* Actually, my template is Bootstrap 3 compatible, and the span4 nomenclature has been changed to cols-xx-#, so the real problem is your component isn't up to date. Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI2LXByb2R1Y3QtY2F0ZWdvcnktZGlzcGxheS84NzA1NzAtcHJvZHVjdC1kaXYtZGlzcGxheS13aWR0aC1vZi1kaXZzLWFuZC1zY3JlZW4/dG1wbD1tYXJrZG93bg==) or [Create an account](/component/users/registration?Itemid=101) to join the conversation. - **[Jerome](/forum/user/80-jerome "View Jerome's Profile")** - [![Jerome's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar80.png)](/forum/user/80-jerome "View Jerome's Profile") - [ Offline](/forum/user/80-jerome) - HikaShop core developer Less More - Posts: 26394 - Thank you received: 4078 - - [](http://obsi.dev) - 12 years 2 months ago [\#168709](#168709) by [Jerome](/forum/user/80-jerome "View Jerome's Profile") Replied by *[Jerome](/forum/user/80-jerome "View Jerome's Profile")* on topic *[Product Div Display - width of divs and screen](/forum/26-product-category-display/870570-product-div-display-width-of-divs-and-screen#168709 "-- HikaShop version -- : 2.3.2 -- Joomla version -- : 3.3.3 -- PHP version -- : 5.3.27 -- Browser(s) name and version -- : any -- Error-message(debug-mod must be tuned on) -- : no error I'm new to Hikashop and purchased the Essential version for this client web site build. We have a fairly minimalist set of products (only 6) and I'm trying to get the 3-col x 2-row layout on the product listing to look like one of the standard Hikashop layouts. That is, the template has Bootstrap and I've turned that on in Hikashop, and it is working properly to reformat the layout as the screen sizes change, but I have one issue I can't seem to fix. On a standard desktop display, I can't make the product divs all the same size, and take up 100% of the space in the content div. See the screenshot attached. What I'd like is three columns of equally-sized (width) product boxes, with the entire content area filled. More like a 100% width table with three equal-size columns. What am I missing that will make this work? Thanks")* Hi, Joomla 3 includes bootstrap 2 libraries and CSS. Bootstrap 3 was released some months (maybe a year) after Joomla 3 ; so for the moment only bootstrap 2 is supported but some idea are emerging in the Joomla community to add also the support of Bootstrap 3. So when we introduce the Bootstrap compatibility in HikaShop, boostrap 3 didn't exist. The two version are too different to be support in the same time ; there is no option to select the bootstrap version ; so only the version provided by Joomla is supported. But you're right, the documentation wasn't up to date (we did not update it after the release of bootstrap 3). [ www.hikashop.com/support/support/documen...hikashop-config.html](https://www.hikashop.com/support/support/documentation/54-hikashop-config.html) > Use bootstrap design: That option is turned off by default. When turn on, the views of HikaShop on the frontend will be responsive and use the bootstrap library for their styling. It requires that your Joomla template supports bootstrap 2. On Joomla 3.0, most templates should. However, if you have display issues on your frontend (like for example the number of columns of your listings which is always 1 no matter what you enter in the "number of columns" option of your menus/modules), it means that your template does not support bootstrap and that you should turn off that option. In such cases, you can potentially install a bootstrap compatibility joomla plugin in order to add the boostrap support on your frontend. Finally, note that some templates might only partially support bootstrap (only the CSS and not the JS, or only some pieces of the CSS) like we found out with at least some YooTheme templates. In that case, we would recommend to contact your template provider for help so that you get all the pieces of bootstrap in it if you want to have a responsive display for HikaShop interfaces. To add the support of "span4", the best is to use the bootstrap 2 CSS ; maybe not the all file, but the grid layout of bootstrap 2 will be require. Regards, --- Jerome - Obsidev.com HikaMarket & HikaSerial developer / HikaShop core dev team. Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI2LXByb2R1Y3QtY2F0ZWdvcnktZGlzcGxheS84NzA1NzAtcHJvZHVjdC1kaXYtZGlzcGxheS13aWR0aC1vZi1kaXZzLWFuZC1zY3JlZW4/dG1wbD1tYXJrZG93bg==) or [Create an account](/component/users/registration?Itemid=101) to join the conversation. Board Categories HikaShop- Install & Update- Product & Category Display- Content Creation- Sales and Orders- - Orders management- - Reports & Statistics- Customers- Checkout- Payment Methods- Shipping Methods- Import & Export (CSV, XLS…)- Specific Features- - Affilation- - Taxes- - Wishlist- - Vote- - Carousel & Slider- - Mass Actions- - Filters & Search- - Discount & Coupon- - Feature Request- Integrations- Showcase- General Talk about HikaShop- Development- - HikaShop 3.0 Beta- Translation- Commercial Jobs HikaShop Components- HikaMarket- - Market: Feature requests- - Market: How to?- - Market: Bug Report- HikaSerial- - General talk about HikaSerial- - Serial: Bug Report- - Serial: How to?- - Support en Français de HikaSerial (French Support)- - HikaSubscription- HikaAuction- - Auction: Feature requests- - Auction: How to?- - Auction: Bug report Hikashop around the world- Support en Français (French Support)- Russian- - FAQ. Курс выживания с Hikashop. Частые вопросы и о- - Расширения Hikashop- - Наши сайты на Hikashop- 日本語版サポート(Japanese Support)- Thai- German Archives- Bug Report- How to? [](/forum/topics/feed/mode-topics?format=feed&type=rss) Time to create page: 0.233 seconds [Powered by](/forum/credits) [Kunena Forum](https://www.kunena.org) [](#top)