由于继承的属性，CSS文本对齐不适用

Question

所以我试图在IPB板内编辑并向子论坛添加一些数据。

正如你所看到的那样，文本信息（状态播放器ping harta）与右边的对齐以及＆＃34; harta＆＃34;变量不具有固定的长度使其不均匀，因此它们不会完全相互作用。

我是从php打印出来的，并试图为它添加一些样式以强制它与左边对齐，但它不会起作用。

    if($_Query->details->tplayers==0)
    {
        $_FIScontent .= "Status: <img src=\"offline.gif\" alt=\"\"> <span style=\"color:red\"> [OFF]</span>";
        $_FIScontent .= "<br><a href=\"http://www.gametracker.com/server_info/" . $tip . ":27015/\" target=\"_blank\"><img src=\"gametracker.png\" border=\"0\" height=\"25\" width=\"75\"></a> ";
        $_FIScontent .= "<a href=\"http://" . $tip . "/\" target=\"_blank\"><img src=\"site.png\" border=\"0\" height=\"25\" width=\"75\"></a> ";
        echo $_FIScontent;
        return $_FIScontent;
    }

    $_FIScontent .= "<div id=\"mata\" class=\"mata\" style=\"
    text-align: left;
    \"><table><tr>";
    $_FIScontent .= "<td>Status: <img src=\"online2.gif\" alt=\"\"> <span style=\"color:green\"> [ON]</span></td>";

    $_FIScontent .= "<td>";
    if($_Query->details->pplayers<10)
        $_FIScontent .= "Players: <span style=\"color:red\">".$_BuildStats[SERVER_PLAYERS]."</span>";
    else if($_Query->details->pplayers<20)
        $_FIScontent .= "Players: <span style=\"color:orange\">".$_BuildStats[SERVER_PLAYERS]."</span>";
    else
        $_FIScontent .= "Players: <span style=\"color:green\">".$_BuildStats[SERVER_PLAYERS]."</span>";
    $_FIScontent .= "</td>";

    //$_FIScontent .= "<tr>";
    $_FIScontent .= "<td>Ping: ".$_BuildStats[SERVER_LATENTA]."ms</td>";
    $_FIScontent .= "<td>Harta: ".$_BuildStats[SERVER_MAP]."</td></table>";
    //$_FIScontent .= "</tr>";

    $_FIScontent .= "<table><td>";
    $_FIScontent .= "<a href=\"http://www.gametracker.com/server_info/" . $tip . ":27015/\" target=\"_blank\"><img src=\"gametracker.png\" border=\"0\" height=\"25\" width=\"75\"></a> ";
    $_FIScontent .= "<a href=\"http://" . $tip . "/\" target=\"_blank\"><img src=\"site.png\" border=\"0\" height=\"25\" width=\"75\"></a>";
    $_FIScontent .= "<a href=\"steam://connect/" . $tip . ":27015/\" target=\"_blank\"><img src=\"connect.png\" border=\"0\" height=\"25\" width=\"75\"></a>";
    $_FIScontent .= "</td>";

    $_FIScontent .= "</table></div>";
    echo $_FIScontent;
    return $_FIScontent;

这里有链接，如果你想看一下，希望这不是非法http://furien.b-zone.ro/query/wadap.php

为每个元素编辑一个表和一个td

    $_FIScontent .= "<div id=\"mata\" class=\"mata\" style=\"
    text-align: left;
    \"><table><tr>";
    $_FIScontent .= "<td>Status: <img src=\"online2.gif\" alt=\"\"> <span style=\"color:green\"> [ON]</span></td>";

    $_FIScontent .= "<td>";
    if($_Query->details->pplayers<10)
        $_FIScontent .= "Players: <span style=\"color:red\">".$_BuildStats[SERVER_PLAYERS]."</span>";
    else if($_Query->details->pplayers<20)
        $_FIScontent .= "Players: <span style=\"color:orange\">".$_BuildStats[SERVER_PLAYERS]."</span>";
    else
        $_FIScontent .= "Players: <span style=\"color:green\">".$_BuildStats[SERVER_PLAYERS]."</span>";
    $_FIScontent .= "</td>";

    //$_FIScontent .= "<tr>";
    $_FIScontent .= "<td>Ping: ".$_BuildStats[SERVER_LATENTA]."ms</td>";
    $_FIScontent .= "<td>Harta: ".$_BuildStats[SERVER_MAP]."</td>";
    //$_FIScontent .= "</tr>";

    $_FIScontent .= "<td>";
    $_FIScontent .= "<a href=\"http://www.gametracker.com/server_info/" . $tip . ":27015/\" target=\"_blank\"><img src=\"gametracker.png\" border=\"0\" height=\"25\" width=\"75\"></a> ";
    $_FIScontent .= "</td>";
    $_FIScontent .= "<td>";
    $_FIScontent .= "<a href=\"http://" . $tip . "/\" target=\"_blank\"><img src=\"site.png\" border=\"0\" height=\"25\" width=\"75\"></a>";
    $_FIScontent .= "</td>";
    $_FIScontent .= "<td>";
    $_FIScontent .= "<a href=\"steam://connect/" . $tip . ":27015/\" target=\"_blank\"><img src=\"connect.png\" border=\"0\" height=\"25\" width=\"75\"></a>";
    $_FIScontent .= "</td>";

    $_FIScontent .= "</tr></table></div>";
    echo $_FIScontent;
    return $_FIScontent;

Answer 1

我设法从你的setInterval停止服务器调用并查看了DOM。它表明您的状态播放器ping和harta已经左对齐。它的行为方式是因为它没有一致的表结构。这意味着因为每行信息的每个表结构都不同，所以布局会有所不同。

解决方法是使用单个表来存放信息。每列信息都需要自己的td。对于主题和回复等信息，您只需在该列的td内创建一个新表。