2017-12-17 12 views
-1

この構文で間違っていることを私に見せてもらえますか?私は、ロゴを1行でレンダリングするのか、別のものの上に重ねるのかを調べようとしています。行を並べる方法

これは私が説明しようとしているものの中に役立ちます場合、私はjsfiddleを作成しました:logos

HTML

<div id="images"> 
     <div class="AuthorizeNetSeal"><script type="text/javascript" language="javascript">var ANS_customer_id="a502c38f-5a39-422d-aa53-a363d6e0fcbax";</script><script type="text/javascript" language="javascript" src="https://verify.authorize.net/anetseal/seal.js" ></script></div> 
     <div><a href="https://www.paypal.com/webapps/mpp/paypal-popup" title="How PayPal Works" onclick="javascript:window.open('https://www.paypal.com/webapps/mpp/paypal-popup','WIPaypal','toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=yes, resizable=yes, width=1060, height=700'); return false;"><img src="https://www.paypalobjects.com/digitalassets/c/website/marketing/na/us/logo-center/9_bdg_secured_by_pp_2line.png" border="0" alt="Secured by PayPal" /></a></div> 
     <div><a href="//www.shopify.com/pci-compliant?utm_source=secure&amp;utm_medium=shop" title="This online store is secured by Shopify" target="_blank"><img src="//cdn.shopify.com/s/images/badges/shopify-secure-badge-light-shadow.png" alt="Shopify secure badge" width="138" height="60" /></a></div> 
    </div> 

CSS

images { 
    white-space: nowrap; 
} 
+0

画像をラップするdivを削除するだけです。 –

+0

空白は要素の配置には使用されません。 [white-space css property](https://developer.mozilla.org/en-US/docs/Web/CSS/whitespace) – JoshKisb

+0

これらの提案はすばらしく、私の構文にも実装されています。ありがとうございました! – rougeOne

答えて

1

試してみてください。

div#images div { 
 
    display: inline-block; 
 
}
<div id="images"> 
 
     <div class="AuthorizeNetSeal"><script type="text/javascript" language="javascript">var ANS_customer_id="a502c38f-5a39-422d-aa53-a363d6e0fcbax";</script><script type="text/javascript" language="javascript" src="https://verify.authorize.net/anetseal/seal.js" ></script></div> 
 
     <div><a href="https://www.paypal.com/webapps/mpp/paypal-popup" title="How PayPal Works" onclick="javascript:window.open('https://www.paypal.com/webapps/mpp/paypal-popup','WIPaypal','toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=yes, resizable=yes, width=1060, height=700'); return false;"><img src="https://www.paypalobjects.com/digitalassets/c/website/marketing/na/us/logo-center/9_bdg_secured_by_pp_2line.png" border="0" alt="Secured by PayPal" /></a></div> 
 
     <div><a href="//www.shopify.com/pci-compliant?utm_source=secure&amp;utm_medium=shop" title="This online store is secured by Shopify" target="_blank"><img src="//cdn.shopify.com/s/images/badges/shopify-secure-badge-light-shadow.png" alt="Shopify secure badge" width="138" height="60" /></a></div> 
 
    </div>

+0

この構文は実装が簡単で、魅力的に機能しました! – rougeOne

関連する問題