1.) You will have to edit the css to get them to behave in a way that satisfies you.
2.) The images do resize, you just don’t like the settings. I suspect you can edit that behaviour in the css. I don’t have your theme so can’t be positive. Start here, find in your style.css:
.entry-content img { width: 680px; }
Change that to 200px and see what happens.
The Corpo theme is a responsive theme, so there are several ways the theme developer may have coded how images are handled at differing viewport sizes. @media declarations are often used and can be edited to force differing breakpoints, those viewport sizes where new styles take over; and edit as needed if you find them.
Be aware that if you modify theme files, your changes will be lost when the theme is updated – it’s therefore recommended that changes be made using a Child Theme –
http://codex.wordpress.org/Child_Themes
Thanks flashbuddy, your suggestion for resizing the size of images for mobile on posts and pages worked.
However I am still having major alignment issues with the services icons in mobile, and the main name of the site (in the header) justifies bizarrely on a phone.
Can’t seem to find the @media references you mentioned in the CSS files so not sure how to fix this.
#services div.widget {
text-align: center;
width: 250px;
}
I just added a width to the widget box so they will stack up evenly.
thanks, that works great, MUCH appreciated. (adjusted to 200px instead of 250 and it is reacting perfectly.)
If I could pick your brain about the last thing, the Name of the site and nag menu justify right on the phone while all other elements of the home page are centred.
the following is the code under the header CSS, any suggestions on what to add to get the name and nav bar to centre?
</div>
<!-- header -->
<header id="header">
<div id="header-inner">
<div id="logo">
<?php if (of_get_option('corpo_logo_image')) : ?>
<a>" class="logo-img"><img src="<?php echo of_get_option('corpo_logo_image'); ?>" alt="<?php bloginfo( 'name' ); ?>" /></a>
<?php else : ?>
<h1 id="site-title"><a>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?> - <?php bloginfo('description'); ?>" rel="home"><?php bloginfo('name'); ?></a></h1><p class="site_tagline"><?php bloginfo('description'); ?></p>
<?php endif; ?>
</div>
<!-- navigation -->
<nav id="main-nav" role="navigation">
<?php
if(has_nav_menu('main-menu')){
wp_nav_menu(array(
'theme_location' => 'main-menu',
'container' => false,
'menu_class' => 'menu',
'menu_id' => 'main-menu',
'echo' => true,
'fallback_cb' => 'wp_page_menu',
'before' => '',
'after' => '',
'link_before' => '',
'link_after' => '',
'depth' => 0,
'walker' => ''
));
}else {
?>
<ul class="nav" id="main-menu">
<?php wp_list_pages('title_li='); ?>
<?php
}
?>
</nav>
<!-- END navigation -->
</div>
</header>
<!-- END #header -->
[Moderator Note: Please post code or markup between backticks or use the code button. Or better still – use a pastebin. Your posted code has now been permanently damaged by the forum’s parser.]
Man, I must work on the mobile version in the next update.
so until next update, no suggestions on mobile alignment??
