The boxes are fixed to 150px square. When I add Image styles to my picture field it is cut in the 150px grid and the title under it dissapears because of overflow:hidden.

.isotope-element {
width: 150px;
height: 150px;
margin: 10px 10px;
float: left;
overflow: hidden;
position: relative;
background: #bebebe;
color: #fff;
}

this class should not be hardcoded I think.

Comments

sunnydeveloper’s picture

Hi,

You might want to checkout this style in the css:

.isotope-element img {
width: 150px;
margin: 0 auto;
text-align: center;
}

rgnyldz’s picture

Thanks, but I know how to fix the problem for my end.

My reason to post this is to point that this method is not dynamic.

For example in views when I try to set an image style for the pictures, it still crops the picture into 150px.

Actualy it's not croping the image, but limiting the whole area to 150x150px, you got the point I hope ;)

Chris Gillis’s picture

Title: Image styles for picture field not working » Default CSS should not specify element size
Status: Active » Closed (won't fix)

I understand you feel that the module should not be specifying default CSS. I believe this is done to make the module easy to test out of the box. I'm sure the module author intended for you to overwrite these styles with your own, which is quite simple with theming. I have no issue with a module including default CSS.

Chris Gillis’s picture

Status: Closed (won't fix) » Closed (duplicate)