Adjust header image and nav bar menu to the center of individual post page
-
Hey Sacred,
I think this is what she’s going for.
https://drive.google.com/open?id=0B7wsbMlxgK8neFY5VVo4NUNuZDg
Jen is this correct?
-
Ah, full width of the browser window. @jenmackintosh, give this a try. Put it at the very end of your custom CSS.
.single #header .container { width: 100%; } .single #header .container #header-image { background-position: center 50%; background-size: cover; width: 100%; } -
Sacred,
For me, that worked as far as the image goes but the nav bar on top is no longer centered.
I’m not able to put all the code at the bottom of the CSS file, since I don’t own the site I’m just plugging things into Chrome’s Inspect Element so maybe that’s why.
Is the navbar centered for you?
-
That’s it!!!! Perfect!!! Exactly what I wanted! THANK YOU BOTH!
Could I ask two more favors?
I like the full stretched header banner – could you give me the css to stretch the header the full width of the browser window on the home page, too?
And…on the right sidebar, the social connect buttons are tiny, justified left, and gray. Is it possible to center them, make them bigger, and make them this color hex #007ea1?
Thanks so much for everything!
-
For the social widgets:
.widget-area .widgets ul {
margin: 0;
text-align: center;
padding: 0;
}.widget-area .widgets ul li a {
color: #007ea1;
font-size: 30px;
} -
-
for the home page header image, I’m going to guess and say do the same thing but replace “.single” with “.home”
.home #header .container {
width: 100%;
}
.home #header .container #header-image {
background-position: center 50%;
background-size: cover;
width: 100%;
}lemme know if that works or not
-
That did it, James! Thanks so much for hanging in there with me! I’m really glad you did!
That’s all I need! :)
-
Awesome! Glad to hear it =]
Don’t forget to mark this thread as “Resolved” and of course feel free to start another thread if you have any more questions.
- The topic ‘Adjust header image and nav bar menu to the center of individual post page’ is closed to new replies.