【问题标题】:How can i move all blocks to top?我怎样才能将所有块移到顶部?
【发布时间】:2025-12-04 03:25:02
【问题描述】:

【我要全部提升:电话图标+号码块,社交媒体图标块和回调块到“特斯拉标志”级别。我尝试了填充和边距,但没有用1

【问题讨论】:

  • 请具体说明问题并发布相关代码。根据您的屏幕截图,您的所有块似乎都是div,并且您正试图将它们对齐。 div 恰好是 block 元素,因此请使用 spaninline-block 属性。

标签: html css margin padding


【解决方案1】:

我觉得对你有帮助

a { 
text-decoration: none; 
color: #333;
}
.top-header > div { 
float: left; 
padding: 0 15px;
}
.callback a { 
background: lightblue; 
border: 2px solid #333; 
padding: 10px 20px; 
border-radius: 10px; 
display: inline-block;     
margin-top: 20px;
}
<head>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
<div class="section">
<div class="top-header">
<div class="logo-block">
<img src="https://lorempixel.com/100/100/" />
</div>
<div class="phone-icon">
<p>
  <i class="fa fa-phone-square" aria-hidden="true"></i> +1(55) 345 67 74
</p>
<p>
  <i class="fa fa-phone-square" aria-hidden="true"></i> +1(44) 231 24 12
</p>
</div>
<div class="social-icon">
<p>
  <i class="fa fa-envelope" aria-hidden="true"></i> hr@gmail.com
</p>
  <a href="">
    <i class="fa fa-twitter-square" aria-hidden="true"></i>
  </a>
  <a href="">
    <i class="fa fa-vk" aria-hidden="true"></i>
  </a>
  <a href="">
    <i class="fa fa-facebook-square" aria-hidden="true"></i>
  </a>
</div>
<div class="callback">
<a href="">callback</a>
</div>
</div>
</div>
</body>

【讨论】:

    最近更新 更多