html - 如何并排放置 3 个 div 并将每个 div 的内容居中

标签 html css

<分区>

我是 CSS 的新手,所以请用简单的术语解释一下。我想要 3 个大小相同的 div,彼此相邻,每个 div 中的内容居中。我有一个带有旋转图像的中心 div,我的左右 div 每个包含 3 个链接。我已经尝试了从设置每个 div 的宽度到左右浮动和居中居中的所有方法。我在这个网站上看过其他一些类似的问题,但我不明白任何答案。如果有帮助,我正在为我的 div 使用以下名称:

左上导航

上中心

toprightnav

代码:

<div id="top">
  <div id="topleftnav">
    <ul>
      <li><a href="home.html">Home</a></li>
      <li><a href="about.html">About Us</a></li>
      <li><a href="services.html">Services</a></li>
    </ul>
  </div>
  <div id="centerright">
   <div id="topcenter">
       <layer id="placeholderlayer"></layer><div id="placeholderdiv"><a href="link.htm"><img alt="image2 (9K)" src="images/image2.jpg" border="0"></a></div>
   </div>
   <div id="toprightnav">
     <ul>
       <li><a href="resources.html">Resources</a></li>
       <li><a href="contact.html">Contact</a></li>
       <li><a href="events.html">Events</a></li>
     </ul>
   </div>
 </div>
</div>

最佳答案

CSS

#1 { 宽度:33%; 显示:内联 文本对齐:居中; '#2 { 宽度:33%; 显示:内联 文本对齐:居中; '#3 { 宽度:33%; 显示:内联 文本对齐:居中;

关于html - 如何并排放置 3 个 div 并将每个 div 的内容居中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19070474/

相关文章:

php - SQL从两个表中选择行,其中一列是公共(public)的,但另一列可能为空

css - 使用 CSS 覆盖 DIV 中的字体大小

html - Ag 网格,防止表格缩放到全宽

javascript - 通过JQuery根据子图片名称删除一个元素

html - 如何使居中容器中的两列高度相等?

javascript - HTML <body> fadeIn/fadeOut 与 jQuery 仅适用于显示 :none

css - Internet Explorer 中的 SVG 缩放

html - 设置行高以适应 CSS Grid 中的内容高度

css - fixed-data-table-2 悬停行背景色

css - Div 在浏览器中没有响应