I am using the bombax wordpress theme. As the description isn't showing up when I use an image for header, I decided to tweak the html/css to show the site slogan on the middle of the header.
This is the site:
<a href="http://www.noticiasnaturais.com/" rel="nofollow noreferrer">http://www.noticiasnaturais.com/</a>
This is the image I want to center (without overlapping the logo at left, the leaves with site name):
<a href="http://www.noticiasnaturais.com/wp-includes/images/descricao_site.png" rel="nofollow noreferrer">http://www.noticiasnaturais.com/wp-includes/images/descricao_site.png</a>
This is the original theme html:
I then tried to change as follows, adding adiv around the href to float it to the left, add an outer div to float to the right (filling the rightmost space), and a third div to be aligned at the middle.
Edit: Just clarifying the question, I need the image with the text to be on the right side of the logo. At this moment I have it directly on the background image, but that doesn't work for all screen resolutions. None of the suggestions (so far) could get it right.
This is the site:
<a href="http://www.noticiasnaturais.com/" rel="nofollow noreferrer">http://www.noticiasnaturais.com/</a>
This is the image I want to center (without overlapping the logo at left, the leaves with site name):
<a href="http://www.noticiasnaturais.com/wp-includes/images/descricao_site.png" rel="nofollow noreferrer">http://www.noticiasnaturais.com/wp-includes/images/descricao_site.png</a>
This is the original theme html:
Code:
<div id="headerwrap">
<div class="clear"></div>
<a href="http://www.noticiasnaturais.com/" title="Notícias Naturais" style="color: rgb(51, 51, 68);">
<img src="http://www.noticiasnaturais.com/wp-includes/images/logoHeader.png" alt="Notícias Naturais" title="Notícias Naturais">
</a>
</div>I then tried to change as follows, adding adiv around the href to float it to the left, add an outer div to float to the right (filling the rightmost space), and a third div to be aligned at the middle.
Code:
<div id="headerwrap">
<div class="clear"></div>
<div style="float:left"><a href="https://www.noticiasnaturais.com/" title="Notícias Naturais" style="color: rgb(51, 51, 68);">
<img src="http://www.noticiasnaturais.com/wp-includes/images/imagefile" alt="Notícias Naturais" title="Notícias Naturais">
</a></div>
<div style="float:left;height: 100%";align=center><img src="https://i.stack.imgur.com/JzdyG.png">
</div>
</div>Edit: Just clarifying the question, I need the image with the text to be on the right side of the logo. At this moment I have it directly on the background image, but that doesn't work for all screen resolutions. None of the suggestions (so far) could get it right.