当给定固定位置时，HTML Div消失_Html_Css

当给定固定位置时，HTML Div消失

html css

当给定固定位置时，HTML Div消失,html,css,Html,Css,目前我正在开发一个类似Facebook的Messenger。现在我在聊天区工作，这个问题应该得到解决。但如果我给出位置：fixed突然div消失。我不知道该怎么办这是我的HTML/PHP代码 <?php // Turn off all error reporting //shop not login users from entering if(isset($_SESSION['id'])){ $user_id = $_SESSION['id'

目前我正在开发一个类似Facebook的Messenger。现在我在聊天区工作，这个问题应该得到解决。但如果我给出

位置：fixed

突然

div

消失。我不知道该怎么办

这是我的HTML/PHP代码

   <?php
// Turn off all error reporting

    //shop not login  users from entering 
    if(isset($_SESSION['id'])){
        $user_id = $_SESSION['id'];
    }else{

    }


require_once("./inc/connect.inc.php");
?>

<header>
    <link rel="stylesheet" href="home - Copy.css" />
        <nav>
            <h3><a class="h3" href="#">Cp</a></h3>
                <div>        
                        <?php

   //Start your session
   session_start();
   //Read your session (if it is set)
   if (isset($_SESSION['user_login']))
      echo $_SESSION['user_login'];



       ?>

                    </div>
                <div><a href="logout.php"><span>Logout</span></a></div>
                <div><a href="#"><span>Settings </span></a></div>




        </nav>
        <body>
        <div class="shead">
        <div class="a1">       <li   >Frequent Member</li>

             <ul>
                <?php
                    //show all the users expect me
                $user_id = $_SESSION['id'];
                    $q = mysql_query("SELECT * FROM `users` WHERE id!='$user_id'");
                    //display all the results
                    while($row = mysql_fetch_assoc($q)){
                        echo "<a href='home.php?id={$row['id']}'><p>{$row['username']}</p></a>";
                    }
                ?>
            </ul>
        </div>




    <div class="a2">      <li >Site's Popular in Your College</li></div>

        </div>
</header>


<div class="rss">

  <?php

  //include('rssclass.php');
  //sinclude('rss.php');

?> 


<div class="message-right">
            <!-- display message -->
            <div class="display-message">
            <?php
                //check $_GET['id'] is set
                if(isset($_GET['id'])){
                    $user_two = trim(mysql_real_escape_string( $_GET['id']));
                    //check $user_two is valid
                    $q = mysql_query( "SELECT `id` FROM `users` WHERE id='$user_two' AND id!='$user_id'");
                    //valid $user_two
                    if(mysql_num_rows($q) == 1){
                        //check $user_id and $user_two has conversation or not if no start one
                        $conver = mysql_query( "SELECT * FROM  conversation WHERE (user_one='$user_id' AND user_two='$user_two') OR (user_one='$user_two' AND user_two='$user_id')");

                        //they have a conversation
                        if(mysql_num_rows($conver) == 1){
                            //fetch the converstaion id
                            $fetch = mysql_fetch_assoc($conver);
                            $conversation_id = $fetch['id'];
                        }else{ //they do not have a conversation
                            //start a new converstaion and fetch its id
                            $q = mysql_query( "INSERT INTO `conversation` VALUES ('','$user_id',$user_two)");
                            $conversation_id = mysql_insert_id($con);
                        }
                    }else{
                        die("Invalid $_GET ID.");
                    }
                }else {
                    die("Click On the Person to start Chating.");
                }
            ?>
            </div>

<div class="send-message">
                <!-- store conversation_id, user_from, user_to so that we can send send this values to post_message_ajax.php -->
                <input type="hidden" id="conversation_id" value="<?php echo base64_encode($conversation_id); ?>">
                <input type="hidden" id="user_form" value="<?php echo base64_encode($user_id); ?>">
                <input type="hidden" id="user_to" value="<?php echo base64_encode($user_two); ?>">
                <div class="textbox">
                    <input class="t_box" type="text" id="message"  placeholder="Enter Your Message"/>
                    <button class="t_btn" id="reply">Reply</button> 
                <span id="error"></span>
                </div>

            </div>
            </div>

            <!--
<div class="textbox">
    <form action="#" method="post">
<input type="text" name="msg_body" class="t_box" id="t_box" >
    <input type="submit" class="t_btn" id="t_btn" name="submit" value="Send">
</form>
        </div>-->



<script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/script.js"></script> 




</body>

有了一个固定的位置，也许你的div在其他内容后面。你试过使用一种新的方法吗？将z索引设置为1将使其向前移动到另一个div上。此外，您的固定位置没有顶部、底部、右侧或左侧尺寸。您可以尝试通过指定这些值来移动div。无论如何，如果没有HTML和CSS的配合，很难判断您的问题是什么。这将帮助你得到更好的回复。

我没有50%的声誉，所以我不得不加上这句话作为回答。

我认为浮动div和固定头寸不太合拍

尝试删除float:left，并按照上面用户的建议，添加left:some_像素，top:some_像素以“绝对”对齐页面上的div。我通常会给div添加一个边框/背景色，以标识它们在页面上的位置（然后稍后删除），因此您可以尝试这样做，以确保它位于您期望的位置

.message-right{
        margin-right:908px;
    background: #fff;
    height: 615px;
    width:455.5px;
    margin-top: 50px;
    **float: left;** <-- remove
    position: fixed;
    left: 50px;
    top: 50px;
}

。消息正确{
右边距：908px；
背景：#fff；
高度：615px；
宽度：455.5px；
边缘顶部：50px；
**float:left；***您的代码看起来不错。添加边框应该可以做到这一点。例如：
但是如果没有剩下的代码（html和css），就很难知道是什么错了
.chat-area{
    margin-right:908px;
    background: #fff;
    border:1px solid black;<-- like this
    height: 615px;
    width:455.5px;
    margin-top: 50px;
    float: left;
    position: fixed;
}

。聊天区{
右边距：908px；
背景：#fff；
边框：1px纯黑；float:left不起任何作用如果您的位置是固定的，您应该添加left:0，相反，您应该始终指定固定元素的垂直和水平位置，除非您希望它停留在呈现的页面部分，这意味着如果您的消息右侧呈现在折叠下方，它将除非你告诉它在什么坐标下它应该保持固定，否则你的用户看不到它。PHP是服务器端，它将生成内容，但不会实际影响输出/显示。问题在于你的CSS或生成的HTML。你可能想将相关的HTML添加到此中。你应该添加所有相关的HTML。你可以拉取sourc从浏览器中删除。相关html是什么意思？请提供编译/呈现的html。@harmlesdragon
.chat-area{
    margin-right:908px;
    background: #fff;
    border:1px solid black;<-- like this
    height: 615px;
    width:455.5px;
    margin-top: 50px;
    float: left;
    position: fixed;
}