Question

我的网站中有一个特定的部分由于CSS和CSS错误导致外观破损。 PHP代码，我今天决定修复它。幸运的是，修复了很多（并且沿途学习了CSS）。

我修复的页面上有动态内容 - 像我们在stackoverflow上的徽章一样。根据用户级别，有些人可能没有任何徽章。

问题是，虽然有徽章的页面看起来不错，但看不完全破坏的页面会在没有徽章的情况下移动页面上的其他内容。

有关我应该如何修复它的任何想法？

CSS：

.ms-sellerprofile {
    width: 100%;
    align:center;
}

.ms-sellerprofile .seller-data {
    width: 100%;
    display: inline-block;
    align:center;
}

.ms-sellerprofile .seller-data > div {
    display: inline;
    float: left;
}


.ms-sellerprofile .seller-data .avatar-box-img {
    float:left;
    width:250px;
    display: inline-block; 
    margin-top:10px;
    margin-bottom:10px;

}

.ms-sellerprofile .seller-data div.avatar-box {
    margin-left: 10px;
    width:250px;
    text-align: left;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 22px;
    display: inline-block; 
    margin-top:10px;
    margin-bottom:10px;

}

.ms-sellerprofile .seller-data .info-box {
    margin-top: 10px;
    margin-left: 290px;
    text-align: right;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 14px;
}

.ms-sellerprofile .seller-data div.ms-badges {
    border: 0;
    margin-left: -240px;
   margin-top: 40px;
}

.ms-sellerprofile .seller-data div.info-box p {
    margin: 5px 0;
}

 .ms-sellerprofile .seller-data div.info-box a {
    color: #38B0E3;
    text-decoration: underline;
}

.ms-sellerprofile .seller-description {
    clear: both;
    margin: 40px 0;
}

PHP：

<div class="ms-sellerprofile">
    <div class="seller-data">
            <div class="avatar-box-img"><a href="<?php echo $seller['href']; ?>"><img src="<?php echo $seller['thumb']; ?>" /></a>
            </div>
            <div class="avatar-box"><a href="<?php echo $seller['href']; ?>"><?php echo $ms_catalog_seller_products; ?></a>
            </div>
            <div class="ms-badges"><?php foreach($seller['badges'] as $badge) { ?>
                <img src="<?php echo $badge['image']; ?>" title="<?php echo $badge['description']; ?>" /></div>
            <?php } ?>


        <div class="info-box">
            <?php if ($seller['country']) { ?>
                <p><b><?php echo $ms_catalog_seller_profile_country; ?></b> <?php echo $seller['country']; ?></p>
            <?php } ?>

            <?php if ($seller['company']) { ?>
                <p><b><?php echo $ms_catalog_seller_profile_company; ?></b> <?php echo $seller['company']; ?></p>
            <?php } ?>

            <?php if ($seller['website']) { ?>
                <p><b><?php echo $ms_catalog_seller_profile_website; ?></b> <?php echo $seller['website']; ?></p>
            <?php } ?>

            <!-- <p><b><?php echo $ms_catalog_seller_profile_totalsales; ?></b> <?php echo $seller['total_sales']; ?></p> --> 
            <p><b><?php echo $ms_catalog_seller_profile_totalproducts; ?></b> <?php echo $seller['total_products']; ?></p>
        </div>
    </div>
</div>

Answer 1

您应该明确处理异常情况。

if($var==NULL){
     //html without using $var
 }
else{
    //html with use of $var
}

当页面缺少元素时，定位CSS问题

1 个答案: