• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

WP SITES

2665

Original Genesis Tutorials & 5000+ Guaranteed Code

Snippets

  • Support
  • Newsletter
  • Videos
  • Log in

Premium Member? - Request custom code

Equal Height Logo & Header Right Widget Content On Desktops

The code in this download folder enables you to display your header image & a image in the header right widget area at equal heights on desktops.

On mobiles, the images will scale down to fit the size of the site header without leaving any space.

Desktop site header images

This way your images won’t be cut off on smaller mobile screens as seen in the following demo video.

Demo Video #

Shows the header image ( logo ) & image in the header right widget area displaying with equal height on desktops and scaling down to fit mobile screens without cutting off any part of the image.

This solution has been written to work with the Enterprise Pro child theme by StudioPress however the method used will work in any theme.

Installation Steps #

There’s 2 steps :

Step 1 – You’ll find the following code between lines 39 – 44 in functions.php. In this example, the values for the height & width have been set at 150px by 300px as seen in the following code example :

Step 2 – Paste the CSS from style.css to the end of your Enterprise Pro child themes style sheet and clear caching.

Download Folder

Enterprise Pro Theme Grid Columns Header Image

Reader Interactions

Leave a Reply Cancel reply

You must be logged in to post a comment.

Primary Sidebar

PHP Code

template_include

get_body_class

if else

array

class_exists

foreach

sprintf

add_action

printf

variable

Advertise · WPEngine · Genesis · Log in

  • How Premium Membership Works
  • Sign Up
  • Support
  • Subscription Details/Invoice
  • Tagged Tutorials
  • Access-Download Problems