0
画像をリンクとして並べて表示しようとしています。ブラウザで実行すると、コードは正常に動作します。しかし、イメージは、エクステンションにロードされたときに垂直に表示されます。 私はこれを理解できません。どんな助けでも大歓迎です。Chromeブラウザ拡張画像リンクを横並びに並べます(水平方向)
<html>
<body>
<!--
<div class="imgContainer">
<a href="popup.html">
<img border="0" src="images/a.png" height="30" width="30">
</a>
</div>
<div class="imgContainer">
<a href="popup2.html">
<img border="0" src="images/b.png" height="30" width="30">
</a>
</div>-->
<!--<div id="imgContainer">
<form action="/popup.html">
<input type="image" src="images/a.png" alt="Submit" width="30" height="30">
</form>
<form action="/popup2.html">
<input type="image" src="images/b.png" alt="Submit" width="30" height="30">
</form>
</div>-->
<div>
<a href="popup.html" >
<img src="images/a.png" width="30" height="30" /></a>
</div>
<div>
<a href="popup.html"> <img src="images/b.png" width="30" height="30" /></a>
</div>
<!--<button type="submit">
<img src="images/a.png" height="30" width="30"/>
</button>
<button type="submit">
<img src="images/a.png" height="30" width="30"/>
</button>-->
<style>
.imgContainer{
display: inline-flex;
}
div {
display: inline-flex;
}
<!--body {
overflow-x: hidden;
font-family: Arial, sans-serif;
font-size: 12px;
}
</style>
</body>
</html>
はい!同じように試しました 同じ問題を再度 –
あなたの親のdivにいくつかの幅を与えてみましたか? –