- Posts: 14
- Thank you received: 0
Width problem when listing products via table
13 years 10 months ago - 13 years 10 months ago #81877
by simon2012
Width problem when listing products via table was created by simon2012
Hi
I'm having a width problem on certain pages when listing products via table layout. As shown in attached images, the main content area seems to extend out of content box on certain pages. Is there any ways to fix this?
compusale.cloudaccess.net/computer-parts...ssories-modding.html
compusale.cloudaccess.net/computer-parts...ual-channel-ram.html
compusale.cloudaccess.net/computer-parts...uad-channel-ram.html
thanks
I'm having a width problem on certain pages when listing products via table layout. As shown in attached images, the main content area seems to extend out of content box on certain pages. Is there any ways to fix this?
compusale.cloudaccess.net/computer-parts...ssories-modding.html
compusale.cloudaccess.net/computer-parts...ual-channel-ram.html
compusale.cloudaccess.net/computer-parts...uad-channel-ram.html
thanks
Last edit: 13 years 10 months ago by simon2012.
Please Log in or Create an account to join the conversation.
13 years 10 months ago #81896
by Xavier
Replied by Xavier on topic Width problem when listing products via table
Hi,
You can try to reduce the width of the td in CSS.
www.hikashop.com/fr/support/documentation/faq.html#css
You can try to reduce the width of the td in CSS.
www.hikashop.com/fr/support/documentation/faq.html#css
Please Log in or Create an account to join the conversation.
13 years 10 months ago #81972
by simon2012
Replied by simon2012 on topic Width problem when listing products via table
Hi Xavier
I'm not sure how to change the table via css editing. Can you please give me an example?
The product table only seems to extend out of the content box on some pages. It seems most logical to have a css that limit the maximum width of the table.
Thanks
I'm not sure how to change the table via css editing. Can you please give me an example?
The product table only seems to extend out of the content box on some pages. It seems most logical to have a css that limit the maximum width of the table.
Thanks
Please Log in or Create an account to join the conversation.
13 years 10 months ago #81975
by sambob
Don't look at what is and ask 'why?'; look at what isn't and ask 'Why Not!'
Replied by sambob on topic Width problem when listing products via table
Hi Simon 2012,
I think you are trying to fit too much in the the limited space you have in the middle of your template.
The page with the biggest overhang is the one with the longest product names. The ones that fit are the ones with smaller product names.
Do you need them that long? Also remember that the product name will probably be used as the URL and these will be VERY long
If you want to keep the long product names, maybe reduce the padding around some of the elements (they are currently set at 20pxls but could be changes via a custom CSS to:
.hikashop_product_name_row {
padding: 0 2px;
}
.hikashop_product_price_row {
padding: 0 2px;
}
.hikashop_product_add_to_cart_row {
padding-left: 2px;
}
.hikashop_product_image_row {
padding: 2px;
}
Add something like that to your custom CSS (Configuration > Display)
To see these behaviors, a great tool if Firebug that your can get in Firefox to inspect (and display changes) a page's CSS.
I think you are trying to fit too much in the the limited space you have in the middle of your template.
The page with the biggest overhang is the one with the longest product names. The ones that fit are the ones with smaller product names.
Do you need them that long? Also remember that the product name will probably be used as the URL and these will be VERY long
If you want to keep the long product names, maybe reduce the padding around some of the elements (they are currently set at 20pxls but could be changes via a custom CSS to:
.hikashop_product_name_row {
padding: 0 2px;
}
.hikashop_product_price_row {
padding: 0 2px;
}
.hikashop_product_add_to_cart_row {
padding-left: 2px;
}
.hikashop_product_image_row {
padding: 2px;
}
Add something like that to your custom CSS (Configuration > Display)
To see these behaviors, a great tool if Firebug that your can get in Firefox to inspect (and display changes) a page's CSS.
Don't look at what is and ask 'why?'; look at what isn't and ask 'Why Not!'
The following user(s) said Thank You: simon2012
Please Log in or Create an account to join the conversation.
13 years 10 months ago #82028
by Eliot
Replied by Eliot on topic Width problem when listing products via table
sambob said everything 
It's just a CSS issue that you can fix by adding some css in Display>Configuration by editing the front end css file.
Using width property can also help you.
Do not hesitate to take a look at our FAQ for more information about css stuff
It's just a CSS issue that you can fix by adding some css in Display>Configuration by editing the front end css file.
Using width property can also help you.
Do not hesitate to take a look at our FAQ for more information about css stuff
Please Log in or Create an account to join the conversation.
Time to create page: 0.077 seconds