Give Comments Fields Some Full Width Love

full-width-input-field

Looking at the WordPress comments field input fields in Genesis on mobile leaves you a bit shortchanged…   Give them a full width feeling… @media only screen and (max-width: 860px) { .comment-respond input[type=”email”], .comment-respond input[type=”text”], .comment-respond input[type=”url”] { width: 100%; } } Just change the max-width value to the pixel number that you want the…

Read More

Adding in a Responsive HTML Logo/Image Header via the Customizer for Genesis

genesis-header-image

This tutorial looks at replacing the CSS background technique used to display a logo/image in the Genesis framework header with an actual HTML markup inline image tag, which is better for responsive design across all devices.  This can be achieved in a couple of ways, one with a filter and one with an action. But first…

Read More

How to Make Images Scale for Responsive Web Design

scale-image-responsively

So you have got your web layout flexing and changing layout in a fluid or responsive web layout – but the images are not quite working they are being stubborn and not scaling and moving around like the text! The reason is because the images most probably have a fixed width which the web layout…

Read More