3列，固定宽度，内容：

Posted

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了3列，固定宽度，内容：相关的知识，希望对你有一定的参考价值。

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  2. 	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3.  
  4. <html>
  5. <head>
  6. <title>3 columns, fixed width, content tallest</title>
  7. <style type="text/css">
  8. #container{
  9. 	background-color:#9cc;
  10. 	float:left;
  11. 	width:500px;
  12. 	border-left:150px solid #cf9; /* The width and color of the left rail */
  13. 	border-right:200px solid #c33; /* The width and color of the right rail */
  14. }
  15. #leftRail{
  16. 	float:left;
  17. 	width:150px;
  18. 	margin-left:-150px;
  19. 	position:relative;
  20. }
  21. #center{
  22. 	float:left;
  23. 	width:500px;
  24. 	margin-right:-500px;
  25. }
  26. #rightRail{
  27. 	float:right;
  28. 	width:200px;
  29. 	margin-right:-200px;
  30. 	position:relative;
  31. }
  32. </style>
  33. </head>
  34. <body>
  35. 	<div id="container">
  36. 		<div id="center">CENTER<br />COLUMN CONTENT</div>
  37. 		<div id="leftRail">LEFT RAIL</div>
  38.  
  39. 		<div id="rightRail">RIGHT RAIL</div>
  40. 	</div>
  41. </body>
  42. </html>

以上是关于3列，固定宽度，内容：的主要内容，如果未能解决你的问题，请参考以下文章

CSS 基本3列CSS布局（固定宽度，居中，页眉和页脚，内容左右两侧的侧边栏）

数据表：仅选定列的固定宽度

如何将列具有固定宽度的 LaTeX 表格的单元格内容居中？

HTML表格列宽实践

css中table列宽怎样动态设置

如何将 html 列宽固定为其内容的最大宽度？