Subcategories Are Messy

[rimex.bg]

This is what happens.

 

I began adding my products, but I'm having issues with the subcategories. As you can see on the pic below there is some issue with the arrangement. They are just all over the place. How to fix this?

 

[rimex.bg]

Bump, please help.

[flipe]

I am using the version 1.5.6 and I have the same kind of problem, in home featured the products are listed well, in the other subcategories too, but in that one no, I got this problem, how could I solve it?

 

I know I need to make changes in my theme category.css, but I don't know what changes to do, the changes I'm searching for is the right arranged of products and right align of "add to cart" button.

Edited November 8, 2013 by flipe (see edit history)

[vekia]

it's due to the different height of elements on this list.

what you have to do is:

- change height param of whole li object. define it manually, it must be the same for each element on list.

[flipe]

I tried do that, but I got any chance in my category product list, that's my category.css in my theme folder, I removed the "height" option.

h1{margin-bottom:10px;}

.resumecat {
	margin:15px 0 10px 0;
	padding:8px 7px;
	color:#000;
	background:#f0f0f0;
}

.content_scene_cat {
	padding:5px;
        display:none;
	border:1px solid #ccc;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	-moz-box-shadow: 0 1px 1px #e2e2e2;
	-webkit-box-shadow: 0 1px 1px #e2e2e2;
	box-shadow: 0 1px 1px #e2e2e2;
}

.cat_desc {
	font-size:12px;
	line-height:18px;
}
.cat_desc p {padding:0 10px 5px 10px}
.cat_desc .lnk_more {
   padding:0 10px;
   color:#0088CC;
	background:url(../img/arrow_right_1.png) no-repeat 100% 4px transparent;
}


/* ************************************************************************************************
      SUB CATEGORIES
************************************************************************************************ */
#subcategories {margin-top:15px;display:none}
#subcategories h3 {
	padding:14px 12px;
	font-size:13px;
	color:#fff;
	text-transform:uppercase;
	text-shadow:0 1px 0 #666;
	background:url(../img/bg_table_th.png) repeat-x 0 0 #999
}

.inline_list {
	list-style-type:none;
	margin-top:10px;
}
.inline_list  li {
	padding:10px 0;
	border-bottom:1px dotted #ccc
}
.inline_list  li .img {
	float:left;
	margin-right:15px
}
.inline_list  li img {
	border:1px solid #ccc
}
.inline_list  li .cat_name {
	font-weight:bold;
	font-size:13px
}

[vekia]

can you share url to your website? i will check it

(sorry if you pasted it somewhere, i don't remember )

[flipe]

I do, but you need to send me your IP number, because I have geolocalization limits.

[vekia]

i replied to your message

[vekia]

add height:260px; to:

#product_list li {
text-align: center;
float: left;
width: 142px;
padding: 16px;
margin-bottom: 14px;
margin-right: 20px;
background-color: #f9f9f9;
height: 260px;
}

it's a part of: /themes/default_grid/css/product_list.css file

 

effect:

[flipe]

add height:260px; to:

 

I tried this, I cleaned the cache, but I got no changes!

[vekia]

i checked your website, you forgot about semicolon after background-color value.

width: 142px;

padding: 16px;

margin-bottom: 14px;

margin-right: 20px;

background-color: #f9f9f9 height: 260px;

[flipe]

Sorry for that, now I got it correctly, but start another fight, how to get the "add to cart" well align or, where can I put a "height" function to change it?

[vekia]

add height:190px; to:

#product_list li h3 {
padding: 0 0 10px 0;
font-size: 13px;
color: #000;
height: 190px;
}

it's also part of /themes/default_grid/css/product_list.css

[flipe]

OMG! that it! thanks for your help!