How to modify the list in wordpress code?

Asked

Viewed 35 times

2

Good afternoon, I have a problem in the development. I want to know how I modify the menu I am doing.

In the function.php is the following code:

<?php
//menu
function register_my_menus() {
  register_nav_menus(
    array(
      'header-menu' => __( 'Header Menu' ),
      'extra-menu' => __( 'Extra Menu' )
     )
   );
 }
 add_action( 'init', 'register_my_menus' );
?>

in the archive header.php is as:

<!doctype html>
<html>
<head>
 <meta charset="utf-8">
 <link rel="stylesheet" type="text/css" href="<?= get_template_directory_uri(); ?>/style.css">
<title><?php bloginfo('name'); ?></title>

</head>
<body>
<?php
wp_nav_menu( array( 'theme_location' => 'header-menu', 'menu_class' => 'menuclasse' ) );
?>

and in the archive style.css:

body{
    background: lightblue;
    text-decoration: none;
}

.menuclasse{
    float: left;
}
.menu-item{
    background: blue;
}

Simply put. The menu on the site is like this:

inserir a descrição da imagem aqui

When I put code float:left, text-style:none, does not work. My goal is to transform into horizontal menu. It does not accept some css codes, and for me to do I need you to accept. Could someone give me a hand?

  • sorry, I didn’t format the code right. I’ll take some prints and put the link.

  • https://1drv.ms/f/s! Ar8gcb6idrj-sD31P_hj8RDN7NaN. This is the code I took print. So my goal is to make a horizontal menu...

1 answer

0

As your goal is to make the menu horizontal, just add the following code to your CSS:

ul.menuclasse li {
    display: inline-block;
    padding: 0 10px;
    list-style: none;
}

This way you’re talking to the element <ul> with class .menuclassee that the items within the <li> should suit the display property inline-block, responsible for ordering items horizontally.

I hope I’ve helped.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.