0

我有一个小问题。我搜索了相关问题,但找不到任何东西。如果可能的话,我想在没有脚本的情况下解决这个问题,并且不调整正文宽度。

所以我们开始吧。我希望徽标显示在框区域内,因为它出现在最大化窗口上。

我也不想将相对位置放置在元素上,因为它在标题和导航栏之间放置了很大的边距。

我试过玩身体宽度并将其设置在其他容器中。没运气。

你可以在这里看到我的意思:http: //imageshack.us/g/43/q3qr.jpg/

这是代码: http: //jsfiddle.net/NCZg8 /4/ `
>

  <div id="page" class="hfeed site">
     <header id="masthead" class="site-header" role="banner">
        <a class="home-link" href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home">
            <h1 class="site-title"><?php bloginfo( 'name' ); ?></h1>
            <h2 class="site-description"><?php bloginfo( 'description' ); ?></h2>
            <img class="Logo_wrapper" src="http://pizza-bar.gr/wordpress/wp-content/uploads/2013/09/PB_Logo.png"/>
        </a>
      </body>`

注意:尝试拉伸“结果”窗口,你会明白我的意思。提前泰。

4

1 回答 1

0

为了防止元素超出右侧的边界,您应该设置 right 属性而不是 left。

.Logo_wrapper{
    position:absolute;
    top:40%;
    right:5%;
    z-index:10;
}

更新小提琴:http: //jsfiddle.net/NCZg8/6/

我也不想将相对位置放置在元素上,因为它在标题和导航栏之间放置了很大的边距。

为了使徽标出现在标题内,position:relative在标题元素上进行设置很重要。要查看相对定位和绝对定位的更详细说明,请参见此处:http ://css-tricks.com/absolute-positioning-inside-relative-positioning/

您的边距问题可能可以用 css 解决。

于 2013-09-27T18:52:11.540 回答