单击按钮后，文本显示在下方

Question

请访问link

你可以在这张图片中看到

请在邮政编码中输入“560043”，然后点击“鼠标按钮”。文字“Check COD Availability At”显示如下图像。但我想在点击“检查”按钮后显示上面的文字。

CSS

.block-check-delivery .block-title strong {background-image:none; font-size: 11px;}
.block-check-delivery .block-content {padding:0 10px;  }
.block-check-delivery input{width: 107px;}
  .block-check-delivery .button {
/*  float: right;   */
position:relative;
left:10px;
    }

.block-check-delivery .block-content > br:first-child {
  display: none;
}

.block-check-delivery .block-content > br:last-child {
  display: none;
}


.block-title {
    position: relative;
    padding: 10px 0 0;
    margin-bottom: 5px;
    // border-top: 1px solid #cccccc; // remove this...
    border-top: none !important; // Add this
    display: inline-block; // 
}

.block-content {
    margin-top: 5px;
    display: inline-block; // 
}


.block-title {
    position: relative; 
    padding: 10px 0 0; 
    margin-bottom: 5px;
    border-top: none;
    display: inline-block; 
    } 

    .std ul { 
    list-style: disc outside; 
    /* margin-bottom: 1.5em; */ 
    }


.product-view .product-shop .short-description { margin-bottom: 5px; clear: both; }

.block, .col-left-first  { margin-bottom:10px; }

PHTML

<div class="block block-list block-check-delivery">
    <div class="block-title">
        <?php $blockLabel = Mage::getStoreConfig('checkdelivery/general/block_title'); ?>
        <strong><span><?php echo $this->__($blockLabel) ?></span></strong>
    </div>
    <div class="block-content" >        
        <br>
            <input name="zipcode" size="17" type="text" id="zipcode" value="<?php echo Mage::getModel('core/cookie')->get('zip'); ?>" maxlength="10" class="input-text" placeholder="<?php echo $this->__('Enter ZIP Code'); ?>"/>
            <button type="button" name="zip-check" title="Check" class="button" id="zip-check" ><span><?php echo $this->__('Check'); ?></span></button>
            <div id="delivery-message"></div>
            <?php $defaultHtml = Mage::getStoreConfig('checkdelivery/general/default_html'); ?>
            <div id="delivery-html"><?php if(Mage::getModel('core/cookie')->get('message')){
    echo Mage::getModel('core/cookie')->get('message');
}
else{
    $defaultHtml; } ?></div>

        <br>        
    </div>
</div>

Answer 1

您可以在此课程中添加此css .block-title：

.block-title {
  border-top: medium none;
  display: inline-block;
  margin-bottom: 5px;
  padding: 10px 0 0;
  position: relative;
  float: left;
}

Answer 2

只需添加以下css

即可

.block-title{
   float:left;
}