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, 4 months ago by
Debs.
-
AuthorPosts
-
May 17, 2013 at 5:10 am #41331
Debs
Participantwhilst 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 #41351Jeremy
MemberHi 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 #41364Debs
Participanthi 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 Kumar
MemberYou 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 #41379Debs
Participanthi 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 Kumar
MemberDebs,
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 #41391Debs
ParticipantMay 17, 2013 at 9:55 am #41393Anand Kumar
MemberHmm, 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 #41394Debs
ParticipantYES!!! 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 Kumar
MemberMay 23, 2013 at 7:50 pm #42389Lennie Appelquist
MemberThat 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 #42421Debs
Participanthi 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.