How to anchor the Superhero themes' header?

modlinesmsv · Member · Sep 3, 2014 at 11:04 pm
Copy link

Add topic to favorites
Hello.
I am trying to anchor the sliding header in the “Superhero” theme. I want it to stay at the top of the blog, not follow the viewer everywhere they go. I could use some help.

I’ve tried the suggestion listed at https://en.forums.wordpress.com/topic/keep-header-at-top-while-scrolling?replies=10, which did not work for me. The suggestion was

.container {
position: relative;
}

#header {
position: fixed;
}

.main, #sidebar {
margin-top: 190px;
}

Does the “Superhero” theme use different code for its’ header? Why isn’t the code above working for the “Superhero” theme?

Thanks in advance for taking the time to read my request. I appreciate it.

The blog I need help with is: (visible only to logged in users)
hallluke · Member · Sep 4, 2014 at 6:43 am
Copy link
Hi!

Most themes are designed independently so will use different code for different sections of the page, this means that CSS that works for one theme is unlikely to work for another.

However, I’ve just visited your site and the header isn’t following me around so it looks like you’ve managed to fix your issue!
modlinesmsv · Member · Sep 5, 2014 at 7:45 am
Copy link
Hello Hallluke, thank you for writing. I believe that I’ve gotten you confused. The issue is still unresolved.
The current situation is that I’m trying to figure out this code to where I can get it workable before I implement it. The code I currently have on my blog is just a compromise; something other than what I’d like but that works for the mean time. What I actually have on the blog right now is a hidden header and an added banner. I would like to keep the banner, make the header visible (so I can manipulate the links on it in order to make the banner clickable), and make the header anchor to the top of the page so that the clickable link stays with the banner instead of following the viewer around on the page.
Sorry for the confusion. I believe that using the current state of my blog as a reference point won’t actually help very much.
hallluke · Member · Sep 5, 2014 at 8:01 am
Copy link
Try changing your first declaration to this:
```
#masthead-wrap{
  background:#fff;
  position:inherit;
}
```

No items found.