[Paul T]

my site is test4.franciscanfriars.org. When I add my site logo ( a small white square image ) it appears above my site title and tagline… thus making the overall header height higher… I’m preferring to minimize height of the header image with text… how do I align my site logo to the left of the text? (I did find custom CSS that claimed to do this on another support topic – for a different theme – trying to look before I ask.. but it did not work.. ) Thanks.

[tikaram]

@friarpaul : Go to Appearance => Customize => Additional css and add the following css

#site-logo {
	width: 25%;
	float: left;
}
#site-header {
	width: 75%;
	float: left;
}
#masthead .wrapper {
	background-color: rgba(0, 0, 0, 0.4);
}

Please remove the following css from the additional css

#site-branding {
    background-color: rgba(0, 0, 0, 0.4);
}

Let me know if you have any more issues.

Regards,
Tikaram

[Paul T]

Thanks… this is better, but there are still two things I would like to do differently…

#1) The Title Text and Tagline are (I am guessing) center Justified in the 75% of the screen area that the custom CSS code you gave me allows them…. thus making a gap between the logo and the words… I would prefer the layout I get on my current operational site: franciscanfriars.org where the text is left justified right along the right edge of the logo image…

#1) with the code you gave me, when I go to a tablet or mobile device.. where the logo image is removed (which I agree is the best thing to do)… the Title Text (and Tagline) do not center but are left Justified in the overall header space (I could live with this… but I’d prefer it to be centered for the smaller screens…)

Thanks

[tikaram]

@friarpaul :
1) To remove the gap add the following additional css

#site-logo {
	text-align: right;
}
#site-header {
	text-align: left;
}

2) To center the title text for small screens add the following css.

@media only screen and (max-width: 990px) {
	#site-header {
		width: 100% !important;
		text-align:center;
	}
}

Let me know if you have any further issues.

Regards,
Tikaram

[Paul T]

Perfect! Thank You!

[Author]

Posts