Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/php/231.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/85.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Php 2列布局缺少内容_Php_Html_Css_Multiple Columns - Fatal编程技术网

Php 2列布局缺少内容

Php 2列布局缺少内容,php,html,css,multiple-columns,Php,Html,Css,Multiple Columns,我正在创建我的网站,需要在我的页面上有两列布局 我有此代码可用于单列布局 <HTML> <head> <link href="style.css" rel="stylesheet" type="text/css" /> </head> <body> <?php include_once('header.php'); ?> <div class="header_02"><cen

我正在创建我的网站,需要在我的页面上有两列布局

我有此代码可用于单列布局

 <HTML>
<head>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>

<?php include_once('header.php'); ?> 

            <div class="header_02"><center>one column layout</center></div>

<div style="position:relative">
<div>
<div style="position:absolute; left:30; top:30;">
    <img src="images/xclo.jpg" width="350" height="215">
  </div>  </div>
  <div style="position:absolute; left:0; top:0;">
    <a href="foo.html"><img src="images/frame.png" width="400" height="400"></a>
  </div>
</div>

column 2 content goes here.          

</div></div>
<?php include_once('footer.php'); ?>  

</body>
</HTML>
它不显示第1列内容

我的问题是:

我怎样才能让它工作

我错过什么了吗

请帮帮我


多谢各位

我已经简化了您的布局,您可以在此基础上进行构建:

这是HTML:

<div>
    <center>2 column layout</center>
</div>
<div id="container">
    <div id="column1">Coumn 1 content</div>
    <div id="column2">column 2 content goes here.</div>
</div>

也许为我们创建一个JSFIDLE,从那里很容易修复它;左:0;排名:0?如果它只想填充整个宽度并位于父元素的顶部,则根本不需要任何样式代码。它不起作用,我认为您的外部样式表中一定有什么东西给您带来了问题,因为这个JSFIDLE本身似乎是有效的:。。。虽然,它似乎并没有浮动的列。。。因为它们不在同一个容器中,所以显示为.Alte。非常感谢。这起作用了。
#container {
  float: left;
  width: 98%;
  position:relative;
  font-size: 22px;
}

#column1, #column2 {
  width: 45%;
  float: left; 
  position:relative;
}
          #column1 { 
           overflow:hidden;
          }

          #column2 {
           border-left: 1px solid #000000;
           padding-left:30px;
          }
<div>
    <center>2 column layout</center>
</div>
<div id="container">
    <div id="column1">Coumn 1 content</div>
    <div id="column2">column 2 content goes here.</div>
</div>
#container {
    font-size: 22px;
}
#column1 {
    float: left;
    width:50%;
    background-color: green;
}
#column2 {
    float: left;
    width:50%;
    background-color:red;
}