billblast104

When I check on my laptop and iPad the live site it is not aligned to the center. As you see I don’t have a home page but only 1 blog post thus far, so I’m not sure if that is considered a single post. Yes, I’m referring to the title in the blog post.

It seems to me that line has what it’s supposed to have:

header h1.entry-title {
text-align: center;
font-weight: bold !important;
}

.inside-header {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}

.site-logo {
-webkit-box-ordinal-group: 2;
-ms-flex-order: 1;
order: 1;
}

.site-branding {
-webkit-box-ordinal-group: 3;
-ms-flex-order: 2;
order: 2;
}

.site-header {
position: sticky;
top: 0;
}

#site-navigation {
position: sticky;
top: 165px;
}

@media (max-width: 768px) {
.site-header,
#site-navigation {
position: relative;
top: auto;
}
}

@leohsiang I don’t have a clue at exactly what I’m looking at…lol I got the CSS from a post in here while looking for the alignment issue. It listed 9 warnings. This is the link that was generated when I put in the CSS starting right after the CSS in my post:

http://jigsaw.w3.org/css-validator/validator$link

@edge22 you are right I was looking at that and saying the same thing and it’s all about the user’s experience and not what I want or thinks looks good. So is it possible to have the header/navigation only be sticky on a desktop?

@edge22

I just checked my site in the customize area on tablet and the navigation bar moves up into the header a little and on mobile, there’s a gap between the header and the navigation bar with no movement. Can you give provide some explanation on why this is the case? And can this be fixed?

Tom,

I’m not 100% sure what the height of the header, I found this code that reduced the size of the header:

.inside-header {
padding: 20px 40px 20px 40px;
}

Leo you are the man…thanks again for all of your help, that work just as I was looking for it to work.