-1

所以这是我的代码：

<?php
$query = mysql_query("SELECT * FROM  views WHERE viewer_ip='".$_SERVER['REMOTE_ADDR']."'")      or die(mysql_error());
$numrows = mysql_num_rows($query);
$serverViewsBeforeAdd = mysql_num_rows(mysql_query("SELECT * FROM views WHERE     server_id='".$_GET['s']."'"));

if(!empty($_SESSION['username'])){
$commentform = "<form action='scripts/addcomment.php?s=".$_GET['s']."' method='POST'><textarea name='comment' style='max-width:98%;min-width:98%;min- height:40px;max-height:40px;' placeholder='Leave a Comment'></textarea><br /><input      type='submit' value='Post' style='float:right;margin-right:2%;'></form>";    
}else{
$commentform = "";  
}

if(empty($_SESSION['voted_'.$_GET['s']])){
mysql_query("INSERT INTO views VALUES('','".$_GET['s']."','".$_SERVER['REMOTE_ADDR']."','".time()."')");
$_SESSION['voted_'.$_GET['s']] = 1;
$serverViews = $serverViewsBeforeAdd + 1;
}else{
$serverViews = $serverViewsBeforeAdd;
}
?>

<style>
#serverTitle {
font-family: corbel;
font-size: 28px;
color: #767676;
text-shadow: 1px 1px 0 rgba(255,255,255,.5);
}
#viewServerRight {
position:absolute;
top:0px;
right:0px;
width:73%;
padding-left:1%;
border-left:solid 1px #666666;
}
#viewServerLeft {
width:25%;
position:relative;
}
#serverActions {
float:right;
padding-top:10px;
padding-right:5px;
}
#serverStatsTitle {
font-family:Impact, Haettenschweiler, "Franklin Gothic Bold", "Arial Black", sans-serif;
font-size: 25px;
color: #CFA900;
text-shadow: 1px 1px 0 rgba(255,255,255,.5);
}
#serverStatsAwnser {
font-family:Impact, Haettenschweiler, "Franklin Gothic Bold", "Arial Black", sans-serif;
font-size: 20px;
color: #6A6A6A;
text-shadow: 1px 1px 0 rgba(255,255,255,.5);
}
</style>
<?php
$s = $_GET['s'];

$query = mysql_query("SELECT * FROM servers WHERE id='".$s."'") or die(mysql_error());
$numrows = mysql_num_rows($query);
if($numrows !== 0){
while($row = mysql_fetch_assoc($query)){

    if($row['server_owner'] == @$_SESSION['username']){
            $serverActionsEdit = "<a href='?p=editserver&s=".$row['id']."' class='button'>Edit</a>";
        }
    if(!empty($row['server_website'])){
            $serverActionsWebsite = "<a href='http://www.".$row['server_website']."' class='button' target='_blank'>Visit Website</a>";
        }
        $serverActionsVote = "<a href='scripts/vote.php?&s=".$row['id']."' class='button'>Vote</a>";
    $serverActionsVoteEmbed = "<a href='?p=voteembed&s=".$row['id']."' class='button'>Vote Embed Code</a>";

    @$serverActions = $serverActionsEdit." ".$serverActionsWebsite." ".$serverActionsVote." ".$serverActionsVoteEmbed;

    echo "<div id='viewServerLeft' align='center'>
    <span id='serverStatsTitle'>Votes</span>
    <br />
    <span id='serverStatsAwnser'>".$row['server_votes']."</span>
    <hr /><span id='serverStatsTitle'>Views</span>
    <br />
    <span id='serverStatsAwnser'>".$serverViews."</span></div>
    <div id='viewServerRight'><span id='serverTitle'>".$row['server_name']."</span><div id='serverActions'>".$serverActions."</div><hr /><br />".$row['server_description']."<br /><hr /><br /><h2>Comments</h2>".$commentform."</div>";
    echo "<title>".$row['server_name']." - ".$_SERVER['HTTP_HOST']."</title>";
}
}else{
echo "<h2><span style='color:red;'>ERROR 404</span>: Server with ID of ".$s." not found!</h2>";
echo "<title>404: Server Not Found!</title>";
}
?>

所以我希望它看起来像“viewServerRight 不要位于具有以下样式的#wrapper 之上：

#wrapper {
position:relative;
display:block;
width:90%;
margin-top:160px;
background-color:#CCCCCC;
margin-right:auto;
margin-left:auto;
border-radius:10px;
-webkit-border-radius:10px;
-moz-border-radius:10px;
-o-border-radius:10px;
-ms-border-radius:10px;
/*  padding:10px;  */
-ms-box-shadow:4px 4px 15px rgba(0, 0, 0, 0.8);
-o-box-shadow:4px 4px 15px rgba(0, 0, 0, 0.8);
-webkit-box-shadow:4px 4px 15px rgba(0, 0, 0, 0.8);
-moz-box-shadow:4px 4px 15px rgba(0, 0, 0, 0.8);
box-shadow:4px 4px 15px rgba(0, 0, 0, 0.8);
}

这就是它现在的样子：

链接到页面

现在的方式#viewServerRight 位于#wrapper 之上，当它像我想要的那样溢出时它不会变得更大，但是#viewServerLeft 会使#wrapper 溢出，那么问题出在哪里？

简短说明：当#viewServerRight 中有更多内容时，我希望#wrapper 的高度更大

4

1 回答 1

0

由于 viewServerRight 的位置是绝对的，它不会影响包装器的高度。现在你有两个选择：

  • 将 viewServerRight 的位置更改为相对或静态
  • 使用 Javascript 或 jquery。获取 viewServerRight 的外部高度并相应地设置包装器的最小高度。

编辑：

是的，你是对的，第一个不起作用。您的整个方法要求您将 viewServerRight div 的位置设置为绝对，如果您删除绝对定位，它会搞砸。告诉你什么，去掉左右div的所有定位，把它们的float设置为left，左右div前后加两个空div。这两个空的 div 应该有这个 css 属性：

clear: both;

我希望我足够清楚。祝你好运 ：）

于 2013-07-09T14:41:36.110 回答