Postingan lainnya
Kelas Premium!
Belajar bikin website dari nol sekarang
Gunakan kupon "lebihcepat" untuk diskon 25%!
Bagaimana cara memindahkan logo web yang sejajar dengan menu navigasi menjadi atas - bawah?
Salam kenal semua. Mau nanya, caranya memindahkan logo web yang sejajar dengan menu navigasi menjadi atas - bawah bagaimana ya?
Maksud saya seperti ini :
FYI saya pakai tema gratisan "Sinatra". Sudah saya ubek-ubek tema nya,tapi belum ketemu.
Barangkali kode ini bisa jadi clue :
#sinatra-header {
position: relative;
}
#sinatra-header-inner {
border-style: solid;
border-left: none;
border-right: none;
border-width: 0;
}
#sinatra-header-inner > .si-container {
-webkit-box-align: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
#sinatra-header-inner .si-widget-wrapper {
height: 100%;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.si-header-element {
margin-left: 1rem;
position: relative;
z-index: 4;
}
.si-header-element:first-child {
margin-left: 0;
}
.si-header-element:empty {
margin-left: 0;
}
========= TAMBAHAN
Ini file header (base.php) :
?>
<?php do_action( 'sinatra_before_header' ); ?>
<div id="sinatra-header" <?php sinatra_header_classes(); ?>>
<?php do_action( 'sinatra_header_content' ); ?>
</div><!-- END #sinatra-header -->
<?php do_action( 'sinatra_after_header' ); ?>
Ini file logo.php
Ini yang navigation.php
<nav class="site-navigation main-navigation sinatra-primary-nav sinatra-nav si-header-element" role="navigation"<?php sinatra_schema_markup( 'site_navigation' ); ?> aria-label="<?php echo esc_attr( 'Site Navigation', 'sinatra' ); ?>">
<?php
if ( has_nav_menu( 'sinatra-primary' ) ) {
wp_nav_menu(
array(
'theme_location' => 'sinatra-primary',
'menu_id' => 'sinatra-primary-nav',
'container' => '',
'link_before' => '<span>',
'link_after' => '</span>',
)
);
} else {
wp_page_menu(
array(
'menu_class' => 'sinatra-primary-nav',
'show_home' => true,
'container' => 'ul',
'before' => '',
'after' => '',
'link_before' => '<span>',
'link_after' => '</span>',
)
);
}
?>
</nav><!-- END .sinatra-nav -->
1 Jawaban:
Coba aja di headernya dikasih display: flex; flex-direction: column;
Atau kalo pake bootstrap bungkus aja logo sama navigasi di bawahnya di row yang berbeda
Gk tau bisa atau nggak karena gak diliatin struktur htmlnya
Tanggapan
Sudah saya edit (tambahkan) bang di pertanyaan. Mohon bantuannya ya.