關於 div 與 div+img ，是否可以有兩種 css 設定？

css css3 js html html5

火爆浪子 2019-01-30 15:24:00 ‧ 2229 瀏覽

分享至

假設有一個區塊叫做 editor

<div class="editor">
</div>

裡面會有兩種區塊

<div class="editor">
    <div><img src=""></div>
    <div>文字</div>
</div>

我外面 editor 設定的是 100%
所以假設放圖片，會是滿版～
文字也會跑到旁邊去～
但我想讓當 div 沒有 img 標籤的時候，左右會 margin: 0 20px
但是當 div裡面有 img 的時候，左右就不 20px 了

.editor div {
    margin: 0 20px;
}
.editor div img{
    margin: 0;
}

但我發現這樣做沒有效
因為畢竟 div 再來才是 img
所以我 div 已經吃到 margin: 0 20px;
img 有沒有 margin 已經不重要⋯⋯
當 div 裡面有 img 時，就滿版不 margin
但是當 div 只有文字，則 margin: 0 20px;
想問問有沒有解法？

Victor iT邦新手 2 級 ‧ 2019-01-30 16:15:37 檢舉

用JavaScript 試試看!
判斷有沒有img 加 margin: 0 20px;

窮嘶發發發 iT邦高手 1 級 ‧ 2019-01-30 17:02:03 檢舉

.editor div:empty{
margin: 0 20px;
}
.editor div{
margin: 0;
}

登入發表討論

直播研討會

{{ item.channelVendor }} {{ item.webinarstarted }} |

直播中

尚未有邦友回答

立即登入回答

關於 div 與 div+img ，是否可以有兩種 css 設定？

尚未有邦友回答

標記使用者