Hi there,

I added an image in the main-content area and the image was quite badly distorted. Further investigation revealed the following in the style.css file:
#main-content .node img {
float: left;
width: 48%;
height: 235px;
padding: 5px;
background: #ffffff;
margin:0 30px 24px 0;
border: 1px solid #DDD;

-webkit-transition: 0.3s all;
-moz-transition: 0.3s all;
-ms-transition: 0.3s all;
-o-transition: 0.3s all;
transition: 0.3s all;
}

You can see from above that img width is being set to 48% and img height is being set to 235px.

I was just wondering why that is being done as it distorts the image display.

Many thanks.

Comments

skech’s picture

skech commented

Hi jussiep, good point..

You can do the following changes into the corkedscrewer/css/style.css file and your images will be resized and not distorted

line 822 style.css 

#main-content .node img { 
    float: left; 
++ max-width: 48%; 
++ width: 100%; 
-- width: 48%;
-- height: 235px;
++ height: auto; 
   padding: 5px; 
   background: #ffffff; 
   margin:0 30px 24px 0; 
   border: 1px solid #DDD; 
 
   -webkit-transition: 0.3s all; 
   -moz-transition: 0.3s all; 
   -ms-transition: 0.3s all; 
   -o-transition: 0.3s all; 
   transition: 0.3s all; 
}

line 1569 style.css 

#main-content .node img { 
   width: 100%; 
++ max-width: 100%; 
   height: auto; 
}

Thanks
Soukri

cindyr’s picture

cindyr commented

FYI, adding width: 100% caused it to continue to remain the original size of the image, even though the content type display setting had been changed to display the thumbnail. Removing the width: 100% and height: auto elements fixed it for me.

gtsopour’s picture

gtsopour commented
Assigned: Unassigned » skech
Category: support » bug
Priority: Normal » Major

Hello skechagia,

just remove the custom width/height definitions and keep only the max-width. In this way, every user will have the option to apply the desired image style through Drupal's User Interface.

Thanks
George

skech’s picture

skech commented
Status: Active » Fixed

Fixed in 7.x-1.x
http://drupalcode.org/project/corkedscrewer.git/commit/60e295c

Thanks
Soukri

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.