Docs

[DodgersWin]

I fixed the Blog page but was not able to fix the single blog post page.

The post/image starts behind my transparent menu (I think I need some sort of margin or padding).

I am using the following CSS
.x-navbar {
position:absolute;
width:100%;
background-color:transparent;
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
border-bottom:none;
}

h1{
line-height: .1;
}

h1 {
font-size: 80px !important;
}

.x-header-landmark{
margin-top: 95px;
}

.blog .x-container.max {
max-width: 900px;
}

[DodgersWin]

This reply has been marked as private.

[Christopher]

Hi there,

Please remove position: absolute; property from following code :

.x-navbar {
    position: absolute;
    width: 100%;
    background-color: transparent;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-bottom: none;
}

To reduce the height between navbar and content, add this :

header.x-header-landmark.x-container.max.width {
    margin-top: 10px;
}

Hope it helps.

[DodgersWin]

Removing position: absolute; property worked great for the single post blog page but led to the home page menu/navbar to no longer being transparent with picture behind it.

[DodgersWin]

This reply has been marked as private.

[Thai]

Hi There,

Please keep your custom CSS and add the following CSS also:

.single-post .x-navbar {
    position: relative;
}

Hope it helps 🙂

[DodgersWin]

Thank you. Worked perfectly.

[Rue Nel]

You’re welcome! We’re happy to help you out.
If you need anything else we can help you with, don’t hesitate to open another thread.

[Author]

Posts