並排的兩個 div - 流體顯示 - Two divs side by side - Fluid display

問題:

I am trying to place two divs side by side and using the following CSS for it.我正在嘗試並排放置兩個 div 併爲其使用以下 CSS。

#left {
  float: left;
  width: 65%;
  overflow: hidden;
}

#right {
  overflow: hidden;
}

The HTML is simple, two left and right div in a wrapper div. HTML 很簡單,左右兩個 div 在一個包裝 div 中。

<div id="wrapper">
  <div id="left">Left side div</div>
  <div id="right">Right side div</div>
</div>

I have tried so many times to search for a better way on StackOverflow and other sites too, But couldn't find the exact help.我已經多次嘗試在 StackOverflow 和其他網站上尋找更好的方法,但找不到確切的幫助。

So, the code works fine at first glance.因此,乍一看,該代碼運行良好。 Problem is this, that the left div gets padding/margin automatically as I increase width in (%).問題是,當我以 (%) 增加寬度時,左邊的 div 會自動獲得填充/邊距。 So, at 65% width, the left div is having some padding or margin and is not perfectly aligned with the right div, I tried to padding/margin 0 but no luck.因此,在 65% 寬度時,左側 div 有一些填充或邊距,並且與右側 div 不完全對齊,我嘗試將填充/邊距設爲 0,但沒有成功。 Secondly, If I zoom in the page, the right div slides below the left div, Its like not fluid display.其次,如果我放大頁面,右邊的div滑到左邊的div下面,就像不是流體顯示一樣。

Note: I am sorry, I have searched a lot.注意:對不起,我已經搜索了很多。 This question has been asked many times but those answers aren't helping me.這個問題已被問過很多次,但這些答案對我沒有幫助。 I have explained what the problem is in my case.我已經解釋了我的情況是什麼問題。

I hope there is a fix for that.我希望有一個解決辦法。

Thank you.謝謝你。

EDIT: Sorry, me HTML problem, There were two "box" divs in both left and right sides, They had padding in %, So left side showed more padding because of greater width.編輯:對不起,我的 HTML 問題,左側和右側都有兩個“框”div,它們以 % 填充,因此左側顯示更多的填充,因爲寬度更大。 Sorry, The above CSS works perfect, its fluid display and fixed, Sorry for asking the wrong question...抱歉,上面的 CSS 效果很好,它的流暢顯示和修復,抱歉問錯了問題......


解決方案:

參考一: https://stackoom.com/question/1AF7u
參考二: Two divs side by side - Fluid display
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章