Community Forums › Forums › Archived Forums › Design Tips and Tricks › images in mocha child theme not responsive
Tagged: mocha child theme, responsive images
- This topic has 11 replies, 4 voices, and was last updated 10 years, 10 months ago by Debs.
-
AuthorPosts
-
May 17, 2013 at 5:10 am #41331DebsParticipant
whilst the mocha theme as a whole is responsive, images uploaded to pages and posts aren't - is there a fix for this?
have switched off all plugins, run the usual tests, and the problem is definitely with mocha...has anybody else come across this problem?
many thanks
May 17, 2013 at 7:49 am #41351JeremyMemberHi Debs,
View the code of each page/post and try deleting the width and height attached to each image. That should fix your responsive issue.
If that doesn't work post a link to your site and I'll help you out.
Jeremy.
If you want to say thanks Follow me on Twitter | My Website
May 17, 2013 at 8:11 am #41364DebsParticipanthi jeremy - thanks for the suggestion - that doesn't work unfortunately. this problem is ONLY happening on mocha...all other themes and genesis parent are fine...it's driving me nuts!
am working on local server so can't send link unfortunately...any other suggestions gratefully received!
May 17, 2013 at 8:47 am #41373Anand KumarMemberYou may try something like this (or check your child theme if there is something similar)
`
/* Images
------------------------------------------------------------ */img {
height: auto;
max-width: 100%;
}.wp-smiley,
.wp-wink {
border: none;
float: none;
}
`
My two small blogs: NetRival | BlogSynthesis
unanswerdMay 17, 2013 at 9:01 am #41379DebsParticipanthi anand - thanks.
yep, the code is there...i have no idea why it doesn't work...unfortunately the demo version of the site doesn't use any large images - but i suspect the mocha theme is broken in some way...
May 17, 2013 at 9:18 am #41382Anand KumarMemberDebs,
Try Firebug to figure out the problem! it will definitely help you. Also try adding !important CSS Declaration.
If possible share a screenshot.
My two small blogs: NetRival | BlogSynthesis
unanswerdMay 17, 2013 at 9:47 am #41391DebsParticipantMay 17, 2013 at 9:55 am #41393Anand KumarMemberHmm, That seems to be different problem.
Check your DIVs #inner or divs/classes inside #inner (like #content-sidebar-wrap)
My two small blogs: NetRival | BlogSynthesis
unanswerdMay 17, 2013 at 10:17 am #41394DebsParticipantYES!!! you are my hero! what a great way to start the weekend...
the culprit was a width:auto instead of 100% right at the end of the responsive styles. the following fixed it!
`.content-sidebar #content,
.full-width-content #content,
.full-width-content.adam-landing #content,
.sidebar-content #content,
.sidebar-content-sidebar #content {
padding: 20px;
/** FIX DIV PROBLEM **/
width: 100%;
}`THANK YOU!
May 17, 2013 at 10:26 am #41396Anand KumarMemberMay 23, 2013 at 7:50 pm #42389Lennie AppelquistMemberThat was an awesome fix - thank you both so much!
`.content-sidebar #content,
.full-width-content #content,
.full-width-content.adam-landing #content,
.sidebar-content #content,
.sidebar-content-sidebar #content {
padding: 20px;
/** FIX padding issue on right margin **/
width: 95%; }`By changing to 95% the output is much cleaner...
FMMG Specializes in Custom WordPress Design and Digital Marketing
May 24, 2013 at 3:28 am #42421DebsParticipanthi lennie... would never have fathomed it without anand's suggestion! the 95% width messes up my sidebar widths for me 🙁
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.