元素不会显示在同一行上

时间:2016-10-18 11:12:40

标签: html css row display

我尝试使用display:inline-block;获取同一行的元素,但它继续向下移动。我尝试使用保证金来调整位置,但这会使响应式网络功能陷入困境。 以下是它现在的样子: enter image description here

以下是它的外观: enter image description here

到目前为止我的代码:

#header .logo-wrap { padding: 50px 0 50px 0; }

#header p.site-desc {
		color: #595959;
		font-size: 18px;
		line-height: 19px;
		text-align-last: right;
width:70%;
		padding-top: -5px;
		letter-spacing: 4px;
	}
	
#carousel {
  position: relative;
  display: inline-block;
  width:70%;
  margin-top: -4px;
}
<div class="logo-wrap">
			<div class="container">
				<div class="desktop-6 columns">
					<h1><a href="index.html" title="Home"><img src="http://i.imgur.com/wobJUCd.png" alt="" /></a></h1>
				<!-- // .desktop-6 -->

				
					<p class="site-desc">
						Digital media designer<br />
						Concept developer<br /><br /><br /><br /><br />
						<p style="font-size:75px; line-height:50px; text-align-last: justify; letter-spacing: 3px; color: #595959; font-family:  Neusa ExtraBold;">i</p></p>
						

    <div id="carousel">
  <div class="btn-bar">
    <div id="buttons"><a id="prev" href="#"></a><a id="next" href="#"></a> </div>
  </div>
  <div id="slides">
    <ul>
      <li class="slide">
        <div class="quoteContainer">
          <p class="quote-phrase"
       
                    style="font-size:44px; line-height:45px; text-align-last: justify; letter-spacing: 3px; color: #595959; font-family:  Neusa ExtraBold;"> minimize,</br>experiment,</br>& make grids</span>
					</p>
					 </div>
					 	  </li>
    
    </ul>
  </div>
</div></div>
					<!-- // .site-desc -->
				</div><!-- // .desktop-6 -->

				<div class="clear"></div>
			</div><!-- // .container -->
		</div><!-- // .logo-wrap -->

1 个答案:

答案 0 :(得分:0)

为每个元素使用float left或者使用ul来使其内联使用ul li {display:inline; }