Header dimensions on Outreach Theme

[forestdesign]

I had to make the Header Left a bit wider to accomodate this customer name and titles on http://www.desmondswaynemp.com
and I did that by changing the dimensions in the functions.php file.
But now, if I put a text widget, or any graphic on Header Right, the last 1/4 or so of Header Left gets covered.
So I need to change the width dimension of Header Right so that it does not encroach on Header Left.
I have looked in the CSS and Function codes but can see nothing obvious to alter, like there is for Header Left.
Any ideas please?

Ignore the url below please - the correct one is above

http://www.desmondswyanemp.com

[Victor Font]

Look for .site-header .widget-area in style.css. The width is set there.

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[forestdesign]

Thank you, I had tried that before, but I tried it again

I made the code in the css
.site-header .widget-area {
float: right;
padding-top: 14px;
text-align: right;
width: 200px;

and the image I put in Header Right was done like this in the widget
<img src="http://www.desmondswaynemp.com/wp-content/uploads/2015/12/twitter-bird-1.jpg" alt="Twitter" style="width:100px;height:80px" />

but still I got the same result like this
http://www.desmondswaynemp.com/header-cutoff.jpg

[Victor Font]

You may be looking at the wrong code. When you don't use a header right widget in Outreach Pro, the header is full width. Once you add anything to the header right area, the header left then uses the width defined in .title-area. This width defaults to 340px. You very likely have to widen this dimension so the image isn't cutoff. Your image is 450px.

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[forestdesign]

Thank you, yes that did it

I changed the width like so

.title-area {
float: left;
padding: 14px 0;
width: 450px;
}

And now the header looks like this with no cutoff to the image in Header Left - result!

http://www.desmondswaynemp.com/

Thank you for your time.

[Author]

Posts