Question

我在切换（nav-trigger）旁边添加了文字“MENY”。但是我不喜欢＆gt; MENY＆lt;的定位，格式/样式没有问题，但是文本需要在切换图标的中间更多。它们像现在一样被困在一起。如何将它们分开以便我可以调整（提高（降低））文本“MENY”？我一直搞砸了，所以任何指导都非常感谢!!

现在如何（图片）：

我喜欢它（图片）：

我的标题php

<html <?php language_attributes(); ?> <?php thb_html_class(); ?>>
<head>
    <?php thb_head_meta(); ?>

    <title><?php thb_title(); ?></title>

    <?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>

    <?php thb_body_start(); ?>

    <div id="page">

        <?php thb_header_before(); ?>

        <header id="header">
            <?php thb_header_start(); ?>

            <div class="header-container">

                <div class="wrapper">
                    <?php
                        $logo = thb_get_option('main_logo');
                        $logo_2x = thb_get_option('main_logo_retina');

                        if( !empty($logo['id']) && !empty($logo_2x['id']) ) : ?>
                        <?php $logo_metadata = wp_get_attachment_metadata($logo['id']); ?>
                        <style>
                            @media all and (-webkit-min-device-pixel-ratio: 1.5) {
                                #logo {
                                    background-image: url('<?php echo thb_image_get_size($logo_2x['id'], 'full'); ?>');
                                    background-size: <?php echo $logo_metadata['width']; ?>px, <?php echo $logo_metadata['height']; ?>px;
                                }

                                #logo img { visibility: hidden; }
                            }
                        </style>

                        <?php endif;
                    ?>
                    <h1 id="logo">
                        <a href="<?php echo home_url(); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>">
                            <?php if( isset($logo['id']) && $logo['id'] != '' ) : ?>
                                <img src="<?php echo thb_image_get_size($logo['id'], 'full'); ?>" alt="">
                            <?php else : ?>
                                <?php bloginfo( 'name' ); ?>
                            <?php endif; ?>
                        </a>
                    </h1>

                    <?php thb_nav_before(); ?>

                    <a href="#" id="nav-trigger">
<span style="font-family: Source Sans Pro; font-size: 16px; line-height: 1; margin-left: 5px; font-weight: 700;">MENY</span> m

                    <div class="nav-wrapper">
                        <nav id="main-nav" class="main-navigation primary">
                            <?php thb_nav_start(); ?>

                            <?php wp_nav_menu( array( 'theme_location' => 'primary' ) ); ?>

                            <?php thb_nav_end(); ?>
                        </nav>

                        <nav id="mobile-nav" class="main-navigation primary">
                            <?php thb_nav_start(); ?>

                            <?php wp_nav_menu( array( 'theme_location' => 'primary' ) ); ?>

                            <?php thb_nav_end(); ?>
                        </nav>
                    </div>
                    <?php thb_nav_after(); ?>
                </div>
            </div>

            <div class="wrapper">

HTML代码：

<a href="#" id="nav-trigger" class="thb-loaded" style="margin-top: 30.5px;"> 
  <span style="font-family: Source Sans Pro; font-size: 16px; line-height: 1; margin-left: 5px; font-weight: 700;">MENY</span> m 
</a>

Answer 1

尝试在包含文本的范围上使用负边距顶值。

分离并重新定位元素？

1 个答案: