- This topic has 5 replies, 3 voices, and was last updated 9 years, 9 months ago by
.
-
Posts
-
I am using the Eleven40 Pro child theme and have a few questions regarding the header area. What I am trying to accomplish is making the header are of this site match with materials the client currently uses. I need to use a specific (unobtrusive) background with a logo to the left and a small image to the right - and separate from - the logo. The image needs to be just about centered in the header area. So here's what I've tried so far:
1. I added css code to use a repeating image as a background in the header area. It looks fine but I noticed on the mobile view that the background also shows behind the mobile drop down menu and it looks terrible. Is there code that would remove that image from the mobile and tablet view and just show it on desktop view?
2. I have added the left-aligned logo, but don' know how I can add the additional image. Is there a way to add a center widget to call that image? Or, alternatively, can the left logo widget area be increased in size without having negative effects on mobile or tablet view? If this were workable, I can do a new logo file that includes the additional image but I'm not sure what then happens on mobile view.
Hoping someone has some ideas!
Thanks.I assume you want a (1) background image which covers the full area of the site header
(2)Then a logo floated left and (3)another floated right, both of which are playered over the background image?1, Yes, wrap the CSS rule in a Media Query and use display: none; to hide it.
2. You need Media Queries to control the CSS rules used to style different elements on different sized screens.
Look at the end of the style.css file for examples of how to use Media Queries.
Also, link to your site please when asking questions relating to CSS so someone can inspect the elements in question.
Thank you for the info. You are mostly correct in what I am looking to do. Yes, I am using a repeating image to cover the full area of the site header. Logo floats left but the menu floats right and I need a third area to use a centered image with all elements layered on top of the background image. Currently, Eleven40 has two areas - logo left and menu right. It's that third (center) area that has me befuddled. Might there be a way to add the third area?
1) and 2) - I have not worked specifically with Media Queries before so I thank you for pointing me in the right direction.
Sorry, I'm unable to post the website as it's on a private development server right now but I do understand that would make it much easier to obtain help.
Thanks again.
You can add the image to a text widget in the header right widget area and float it left. You can also extend the width of the header right widget area by the same amount you decrease the title area.
Not sure why, but it never occurred to me to just add an image to the current widget area that holds the menu and just float it left. Thank you for the suggestion!
hi i am using Eleven40 theme to my site Admitcards Result but i can't add advertise below menu bar.
Thanks in advance
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.