将折叠的标题 header 居中放在博客 emporio 主题上

Question

I'm trying to tweak my blogger template (the emporio porcelain theme) to get the collapsed header with my blog logo and text centered. I have managed to get the logo and the text under it but i'm not being able to fix it to make it center

.centered-top-container.sticky .widget.Header h1 {display: none;}
.centered-top-container.sticky .header-inner {text-align: center;}
.centered-top-container.sticky .Header .header-image-wrapper {display: block!important;}
.centered-top-container.sticky .Header img{max-height: 50px;  width: auto;}

I'm trying to use text-align: center on header-inner but i'm not being able to do it. Can anyone help me out on trying to figure what i'm doing wrong?

[blog link][2] [2]: https://www.cheiroaestrume.com/

Answer 1

You should change your flex code.

.sticky .centered-top .blog-name{
  ...
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  ...
}
.sticky .centered-top .search{
  ...
  -webkit-flex: 0 0 auto;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  ...
}