Move Menu Below Logo

  • I am trying to move my menu below the logo and center both, much like on my current page https://www.outloudtalent.com.

    The new page can be found at https://www.outloudtalent.com/newsite

    Can someone PLEASE help? The header CSS is below. Thank you soooo much in advance.

    <?php global $theme; ?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><?php function wp_initialize_the_theme() { if (!function_exists("wp_initialize_the_theme_load") || !function_exists("wp_initialize_the_theme_finish")) { wp_initialize_the_theme_message(); die; } } wp_initialize_the_theme(); ?>
<html xmlns="https://www.w3.org/1999/xhtml" <?php language_attributes(); ?>>

<head profile="https://gmpg.org/xfn/11">

<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
<title><?php $theme->meta_title(); ?></title>
<?php $theme->hook('meta'); ?>
<link rel="stylesheet" href="<?php echo THEMATER_URL; ?>/css/screen.css" type="text/css" media="screen, projection" />
<link rel="stylesheet" href="<?php echo THEMATER_URL; ?>/css/print.css" type="text/css" media="print" />
<!--[if lt IE 8]><link rel="stylesheet" href="<?php echo THEMATER_URL; ?>/css/ie.css" type="text/css" media="screen, projection" /><![endif]-->
<link rel="stylesheet" href="<?php echo THEMATER_URL; ?>/css/defaults.css" type="text/css" media="screen, projection" />

<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen, projection" />

<?php  wp_head(); ?>
<?php $theme->hook('head'); ?>

</head>

<body <?php body_class(); ?>>
<?php $theme->hook('html_before'); ?>

<div id="wrapper">

    <div id="container" class="container">

        <div id="header" class="span-24">

            <div class="branding">
            <?php if ($theme->display('logo')) { ?>
                <a href="<?php bloginfo('url'); ?>"><img class="logo" src="<?php $theme->option('logo'); ?>" alt="<?php bloginfo('name'); ?>" title="<?php bloginfo('name'); ?>" /></a>
            <?php } else { ?>
                <h1 class="site-title"><a href="<?php bloginfo('url'); ?>"><?php bloginfo('name'); ?></a></h1>
                <h2 class="site-description"><?php bloginfo('description'); ?></h2>
            <?php } ?>
            </div><!-- .branding -->

            <div class="header-right">

                <?php
                    if($theme->display('menu_primary')) {
                        $theme->hook('menu_primary');
                    }
                ?>

            </div><!-- .header-right -->

        </div><!-- #header -->

        <?php if($theme->display('menu_secondary')) { ?>
            <div class="span-24">
                <?php $theme->hook('menu_secondary'); ?>
            </div>
        <?php } ?>
Viewing 1 replies (of 1 total)

  • That’s not CSS, that’s PHP.

    If there is a class assigned to the menu, try this in your child theme stylesheet:

    .whatever_the_menu_class_is {
    margin-left:auto;
    margin-right:auto;
}
Viewing 1 replies (of 1 total)
  • The topic ‘Move Menu Below Logo’ is closed to new replies.