CSS OnePageCheckoutは垂直に表示されます

Question

私のOnePageCheckoutは垂直に表示されます。

このように見えるはずです： goo.gl/5hrh4d

しかし今、それはこれです： goo.gl/gv5gkr

問題が見つかりません。

CSS/Magento/OPCの経験がある人が私を助けることができますか？どうもありがとう！

OnePageCheckout.phtml：

<div class="page-title">
    <h1 class='h1_opc'><?php echo Mage::getStoreConfig('onepagecheckout/general/title') ?></h1>
    Fill in the fields below to complete your purchase!
    <?php if (!Mage::getSingleton('customer/session')->isLoggedIn()){ ?>
    <p class="onepagecheckout_loginarea">
        <a href="javascript:void(0)" class="onepagecheckout_loginlink" onclick='open_login();'>
            <?php echo $this->__('Already registered? Click here to login') ?>
        </a>
    </p>

    <?php 

        echo $this->getChildHtml('customer.login');
        echo $this->getChildHtml('customer.forgot');

    }    
    ?>
</div>
<div class='ptdivline'></div>

<?php echo $this->getMessagesBlock()->getGroupedHtml() ?>

<?php
$seq_http   = (!empty($_SERVER['HTTPS']) && $_SERVER['HTTPS']==='on');

?>
<script type="text/javascript">
    var http_type   = '<?php if($seq_http){echo 'https';}else{echo 'http';}?>';
</script>
<script type="text/javascript" src="<?php echo $this->getSkinUrl('js/onepagecheckout.js') ?>"></script>

<script type="text/javascript">countryRegions = <?php echo $this->helper('directory')->getRegionJson() ?></script>

<form action="" id="onepagecheckout_orderform">
<div class="col3-set onepagecheckout_datafields">
    <div class="col-1">
        <?php echo $this->getChildHtml('billing.address') ?>
        <?php echo $this->getChildHtml('shipping.address') ?>
    </div>

    <div class="col-2">
        <?php echo $this->getChildHtml('shipping.method') ?>
        <?php echo $this->getChildHtml('payment.method') ?>
         <div id="checkout-coupon-discount-load">
            <?php echo $this->getChildHtml('coupon') ?>
        </div>

        <?php if (Mage::getStoreConfig('onepagecheckout/general/comment')) : ?>
        <div class="op_block_title">
            <?php echo $this->helper('sales')->__('Comment') ?>
        </div>        
        <div class="form_fields">
            <div class="full">
                <div class="data_area" id='comment-block'>
                    <textarea name="order-comment" id="order-comment"><?php echo trim(Mage::getSingleton('customer/session')->getOrderCustomerComment()) ?></textarea>
                </div>
            </div>
        </div>
        <?php endif; ?>
        <?php if (Mage::helper('onepagecheckout')->isSubscribeNewAllowed()) : ?>
            <p class="newsletter">
                <input type="checkbox" id="newsletter-signup" name="newsletter" value="1" title="<?php echo Mage::helper('newsletter')->__('Sign up for our newsletter') ?>" class="checkbox" />
                <label for="newsletter-signup">
                    <?php echo Mage::helper('newsletter')->__('Sign up for our newsletter') ?>
                </label>
            </p>
        <?php endif; ?>
    </div>

    <div class="col-3">
        <?php echo $this->getChildHtml('review') ?>
    </div>
</div>
</form>

<script type="text/javascript">
//<![CDATA[
    var checkout = new OPC('onepagecheckout_orderform', {
        save    : '<?php echo $this->getUrl('onepagecheckout/index/saveOrder', array('_secure'=>$seq_http)) ?>',
        update  : '<?php echo $this->getUrl('onepagecheckout/index/updateCheckout', array('_secure'=>$seq_http)) ?>',
        success : '<?php echo $this->getUrl('onepagecheckout/index/success', array('_secure'=>$seq_http)) ?>',
        failure : '<?php echo $this->getUrl('checkout/cart') ?>'
    }, "<?php echo $this->__('Please agree to all the terms and conditions.') ?>");

    document.observe("dom:loaded", function() {
        var win_triggers    = Array();
        $$('.checkout-agreements .agree a').each(function(item){
            var obj = {
                el: $$('.' + item.className),
                event: 'click',
                window: $(item.className + '-window')
            };
            win_triggers.push(obj);
        });
        opc_window  = new OPC.Window({triggers: win_triggers});
    });
//]]>
</script>

Answer 1

おそらくそれはCSSの問題です。これをCSSに追加してみてください：

#onepagecheckout_orderform .col3-set .col-1{float:left}
#onepagecheckout_orderform .col3-set .col-2{float:left}
#onepagecheckout_orderform .col3-set .col-3{float:left;width:40%}

3番目の列のメインの幅値には、調整が必要です。必要なものをご覧ください。