div内部的html内容出现在div内部

时间:2012-10-07 01:13:29

标签: css html

我的DIVS动作遇到了麻烦。基本上我有一个div和div之外如果我把一些html文本仍然显示在div内。我不确定我做错了什么。如果有人可以偷看,我会非常感激。提前谢谢。

HTML:

<div id="content">

            <p>  To submit <?php echo $_SESSION['sight_type']?> sightings, choose a location type.</p>

        <div id = "form_location_type" >`

        <form method="POST" action="location_type_input.php">
            <table>
            <tr>
            <td><input type="radio" name="location_type" value="new"  /></td><td><p> New location</p></td></tr>
            <tr>
            <td><input type="radio" name="location_type" value="saved" /></td><td><p> Saved location</p></td>
            <td><input type="submit" value="Continue"></td></tr>
            <table>
        </form>
        </div>     <!-- End form_location_type div -->
         THIS SHOULD BE OUTSIDE ABOVE DIV BUT IT PRINTS INSIDE                   
    </div> <!-- End content div -->

    <div id="footer"> <?php include 'footer.php'; ?> </div> <!-- End footer div -->

css(最相关的是最后一个评论部分)

html { height: 100%; }
body, html { min-height: 100%; height: 100%;margin : 0;
    padding : 0; }
/*html, body {
    height:auto
    height: 100%; }/* Required */



body {


    width:100%;
    line-height : 1.8em;
    color : #000000;
    background : #F5F5FF; 
    }

#container {

    position: relative;
    min-height: 100%;
    width : 800px;
    margin : 0 auto 0 auto;
    border-style: solid;
    border-width:1px;
    background : #FFFFCC;
    -moz-box-shadow: 10px 10px 5px #888888; /* shadow border */
    box-shadow: 10px 10px 5px #888888;
    }
#footer {
    clear:both;
    position:absolute;
    text-align: center;
    left:0;
    bottom: 0;
    width: 800px;
    background : #FFFFCC;
    font : 75% "Trebuchet MS", verdana, arial, tahoma, sans-serif; 

    } 

/* form on form_location_type.php */   
#form_location_type {

margin: 0 auto;
background:white;
border:solid 1px;
}

2 个答案:

答案 0 :(得分:8)

确保正确关闭桌子:

<table>
    ...
</table>

这似乎是问题所在:http://jsfiddle.net/RDGuY/2/

答案 1 :(得分:0)

您尚未正确关闭表格。

添加

</table>

而不是

<table>

在form_location_type div

的末尾

另外尝试在form_location_type div中添加一些底部填充:

在CSS中添加以下代码:

#form_location_type {
  padding-bottom: 2em;
}

现在检查文本是否与表格div ???

分开