html5中的css标题和侧栏导航问题

html5中的css标题和侧栏导航问题,css,html,Css,Html,这是我的html5代码: <header id="header"> <img src="img/logo.png" alt="logo" id="logo"> <h1>The Articles</h1> </header> <section id="section"> <article class="article"> <img src="img/arti

这是我的html5代码:

 <header id="header">
    <img src="img/logo.png" alt="logo" id="logo">
    <h1>The Articles</h1>
 </header>
 <section id="section">
    <article class="article">

          <img src="img/articles.png" alt="articles" />
          <p class="comments">
             by<span class="woo"> JOHN WOO</span> 
             <date>June 04, 2013, 22 Comments</date>
          </p>
          <h1 class="issue">Issue No 376</h1>
          <p class="lorem">Lorem ipsum dolor sit amer, consectetur adipising elit Vestibulum eu ligula justo, ullamcorper viverraest. Donec viverra libero in tellus ullamcorper lobortis,. Nam nunc metus, molestie sit amet sagitis et, hendrenit quam. Ut hendrerit commodo nunc, eu euismod odio egestas a. Morbi felis lorem, convallis id scelerisque eget, faucibus eget lectus.</p>
          <p class="dev-express">asp.net, .net, dev-express</p>
          <a href="#" class="myButton">More</a>

       <div class="border-bottom"></div>
       <div class="article1">
          <img src="img/cat.png" alt="" />
          <p class="comments">
             by <span class="woo">JOHN WOO</span> 
             <date>June 04, 2013, 22 Comments</date>
          </p>
          <h1 class="issue">Issue No 375</h1>
          <p class="lorem">Lorem ipsum dolor sit amer, consectetur adipising elit Vestibulum eu ligula justo, ullamcorper viverraest. Donec viverra libero in tellus ullamcorper lobortis,. Nam nunc metus, molestie sit amet sagitis et, hendrenit quam. Ut hendrerit commodo nunc, eu euismod odio egestas a. Morbi felis lorem, convallis id scelerisque eget, faucibus eget lectus.</p>
          <p class="dev-express">asp.net, .net, dev-express</p>
          <a href="#" class="myButton">More</a>
       </div>

    </article>
    </section>

文章

吴宇森 2013年6月4日,22条评论

第375期

lorem ipsum dolor sit amer、Concertetur adipising elit estabulum eu ligula justo、ullamcorper viverrest。多内克·维韦拉·利伯托在泰勒斯·乌拉姆科珀·洛博蒂斯,。Nam nunc metus,molestie sit amet sagitis et,hendrenit quam。但亨德雷特·康莫多·努克(hendrerit commodo nunc),欧盟委员会(euismod odio egestas a。莫比·费利斯·洛雷姆,康瓦利斯·艾格特,福西布斯·艾格特·莱克特

asp.net、.net、dev express

这是我的JSFIDLE:

现在,我的网页如下所示:

在我标记的页面中,标题和侧栏导航需要放在同一行

这是定位导航的正确格式吗

或者我可以知道css属性来解决这个问题吗

任何帮助都将不胜感激


提前感谢。

查看网站后,您需要添加一些更改。下面是要添加的css代码:

.aside {
   margin-top: -80px;
}

.aside > img {
   margin-top: 25px;
}

就这样,

你想在“文章”后面加导航链接?这是我的疑问。。但我需要头衔“文章和导航是放在同一行上的。那么在哪里放置导航链接,在文章中还是放在旁边呢?我知道这种改变的方法。”。。但是我需要一些标准的css属性。。从你的回答来看,你的网站几乎是用许多css样式呈现给不同的元素,并且相互链接,所以它也会干扰其他元素的定位,所以我提供了一个快速的解决方案。