サイトタイトル(ロゴ)とトップメニューを中央表示にする

サイトタイトル(ロゴ)とトップメニューを中央表示にするカスタマイズです。


コード

カスタマイズ方法は以下を参照ください

 

/* サイトタイトル・トップメニューの中央表示 */
#top {
    text-align: center;
}
#logo {
    float: none;
    display: block;
    font-size: 30px;/* タイトルのフォントサイズはここを変更 */
    padding: 10px 0;
}
#logo a {
    display: inline-block;
    height: auto;
}
#logo a img {
    width: auto;
    max-height: 50px;/* ロゴ画像の高さはここを変更 */
    padding:  0;
}
#topmenu, #topmenu li {
    float: none;
    display: inline-block;
    vertical-align: middle;
}
@media screen and (max-width: 767px) {
    #logo {
        display: table;
        table-layout: fixed;
        width: 60%;
        margin: 0 auto;
        padding: 0;
    }
    #logo a {
        display: table-cell;
        height: 60px;
        padding: 0 2px;
    }
    #logo a img {
        margin: 5px 0;
    }
    #topmenu {
        display: block;
    }
}