[Anonymous]

Hello admin,

Why is the picture on content is not use my size setting? it’s always resize to big size.. How to fix it ?

Thank you admin.

[Anonymous]

I’ve found the css..
You guys use this for Desktop Old With min-width 992px;

/* BLOG */
.post .entry-content > p img:not(.alignleft):not(.alignright),
.post .entry-content .gallery {
width: 158%; margin-left: -29%;
}

And Tablet With min-width 768px;

/* BLOG */
.post .entry-content > p img:not(.alignleft):not(.alignright),
.post .entry-content .gallery {
width: 132%; max-width: none; margin-left: -16%;
}

But it affects on monitor with resolution 1920×1080..

My post that affect so much with picture bigger size
https://www.ericliputra.xyz/wordpress/wordpress-chrome-push-notification/

[Anonymous]

I got the author want.. The width is for the content size..
so the picture not follow the default content width = 540px;

so the image can wider than the article.. but the width on the css affect the image.. not the container.. so if the picture size is 100×100.. then the picture will get bigger 132% or 158%..

[Anonymous]

I’ve tried to disable the css.. and make it like

/* BLOG
.post .entry-content > p img:not(.alignleft):not(.alignright),
.post .entry-content .gallery {
width: 158%; margin-left: -29%;
} */

And Tablet With min-width 768px;

/* BLOG
.post .entry-content > p img:not(.alignleft):not(.alignright),
.post .entry-content .gallery {
width: 132%; max-width: none; margin-left: -16%;
} */

The image now looks fine and good.. but its same width with the content.. (540px;) not bigger like the demo article.. that image

[Anonymous]

Anyway its error for center alignment only..

[serkan]

Hi GaroPpo,
Could you explain it to me more please? What do you want to get with aligncenter?
Where did you put your custom css code? Did you edit the theme files?

[Anonymous]

What i want for image that aligncenter is that the image width not change to 158% for screen with min width 992px and width change to 132% for screen with min width 768px.. So if image with 100px width will not changed to 158% or 132%. It will make the image broken or blur. because the css force to make the width bigger than original size.

What i get from the original css is that to make the image with center align more wider than the original article width (540px). So visitor can enjoy the image with larger width like the article on demo (http://themes.pixelwars.org/empathy/love-is-a-strong-word/) the third image..

i edit the themes css..
I make a comment tag to disable the css.. so the image size is original.

i disable this line on css..
/* BLOG
.post .entry-content > p img:not(.alignleft):not(.alignright),
.post .entry-content .gallery {
width: 158%; margin-left: -29%;
} */

And Tablet With min-width 768px;

/* BLOG
.post .entry-content > p img:not(.alignleft):not(.alignright),
.post .entry-content .gallery {
width: 132%; max-width: none; margin-left: -16%;
} */

[Anonymous]

My example post with original css..
https://www.ericliputra.xyz/wordpress/wordpress-chrome-push-notification/

You cans see the image that have a smile size is forced to get bigger because the css..

[serkan]

Hi GaroPpo,
Please don’t edit the theme file. You can use this custom css codes;
http://www.pixelwars.org/forums/topic/how-to-use-custom-css-for-wordpress-themes/

@media screen and (min-width: 992px) { .post .entry-content > p  img:not(.alignleft):not(.alignright), .post .entry-content .gallery { width: 100%; margin-left: 0; } }

@media screen and (min-width: 1200px) { .blog-single .alignleft, .blog-single .wp-caption.alignleft { max-width: 68%; margin-left: 0;  margin-right: 2em; } }

@media screen and (min-width: 1200px) { .blog-single .alignright, .blog-single .wp-caption.alignright { max-width: 68%; margin-right: 0; margin-left: 2em; } }

@media screen and (min-width: 768px) { .post .entry-content > p img:not(.alignleft):not(.alignright), .post .entry-content .gallery { width: 100%; max-width: none; margin-left: 0; } }

[Anonymous]

Thank you..

[serkan]

You’re welcome, please don’t forget to rate the theme on themeforest if you liked it, thanks.

[Anonymous]

Hello Serkan,

Just want to tell you that what exactly i want looks likes is like this..
https://www.ericliputra.xyz/wordpress/wordpress-chrome-push-notification/

I modified your custom css..
@media screen and (min-width: 992px) { .post .entry-content > p img:not(.alignleft):not(.alignright) { width: 540px; } }

@media screen and (min-width: 768px) { .post .entry-content > p img:not(.alignleft):not(.alignright) { width: 540px; } }

@media screen and (min-width: 992px) { .post .entry-content > p img:not(.alignleft):not(.alignright), .post .entry-content .gallery { width: auto; max-width: 100%; margin: auto; } }

@media screen and (min-width: 768px) { .post .entry-content > p img:not(.alignleft):not(.alignright), .post .entry-content .gallery { width: auto; max-width: 100%; margin: auto; } }

@media screen and (min-width: 1200px) { .blog-single .alignleft, .blog-single .wp-caption.alignleft { max-width: 50%; margin-left: 0; margin-right: 2em; } }

@media screen and (min-width: 1200px) { .blog-single .alignright, .blog-single .wp-caption.alignright { max-width: 50%; margin-right: 0; margin-left: 2em; } }

Hope this usefull for others.. Thank your for your help Serkan..

[serkan]

Thanks for the feedback. :=)