[問題] div可以不斷行嗎?

看板Web_Design作者 (琦琦壹伍零參)時間15年前 (2009/07/29 21:53), 編輯推噓7(7015)
留言22則, 9人參與, 最新討論串1/1
我想要將四個表單排成如下 ┌───┐┌───┐ │   ││   │ │   ││   │ │   ││   │ └───┘└───┘ ┌───┐┌───┐ │   ││   │ │   ││   │ │   ││   │ └───┘└───┘ 所以我這樣寫 <div>表單一</div> <div>表單二</div><br /> <div>表單三</div> <div>表單四</div> 可是排出來變成垂直的四個方塊 似乎是div會自己換行 請問我要如何排出我想要的畫面? -- ※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 203.70.97.102

07/29 21:55, , 1F
都下 float:left ; 表單三要加作clear:left
07/29 21:55, 1F

07/29 22:02, , 2F
div{display:inline;}
07/29 22:02, 2F

07/29 22:34, , 3F
div{display:inline-block;} 一樓的方法比較常見
07/29 22:34, 3F

07/29 22:53, , 4F
Tony大,這樣寫有個萬惡瀏覽器不吃喔
07/29 22:53, 4F

07/29 23:42, , 5F
為什麼不用span?
07/29 23:42, 5F

07/30 08:13, , 6F
span
07/30 08:13, 6F

07/30 08:20, , 7F
哪個瀏覽器不吃? @_@ 這是很基本的技巧欸 .
07/30 08:20, 7F

07/30 08:25, , 8F
剛測了一下 , ie6的確是還有空間的狀況下會往左縮 , 不過
07/30 08:25, 8F

07/30 08:25, , 9F
平常都會搭配寬度的設定 , 所以倒是一直沒注意到這點. :3
07/30 08:25, 9F

07/30 08:28, , 10F
還有個我比較習慣的寫法是 一行一個container , 這樣也比較
07/30 08:28, 10F

07/30 08:28, , 11F
有具體的結構化 , 如果不下container的話就以寬度來確實掌控
07/30 08:28, 11F

07/30 08:28, , 12F
每行的div數量 .
07/30 08:28, 12F

07/30 12:21, , 14F
瞭解了,原來float+clear使用就可以了
07/30 12:21, 14F

07/30 12:21, , 15F
不過其實display:inline-block效果也一樣
07/30 12:21, 15F

07/30 12:24, , 16F
感謝樓上各位的解說及T大的實例介紹,謝謝
07/30 12:24, 16F

07/30 12:28, , 17F
inline-block被支援度很差說..
07/30 12:28, 17F

07/30 12:32, , 18F
我也記得inline-block 在某個瀏覽器上是不support的 @_@
07/30 12:32, 18F

07/30 12:33, , 19F
IE6. 7 Firefox 2....
07/30 12:33, 19F

07/30 12:34, , 20F
反正如果有簡便的語法 ie6就不會支援XD
07/30 12:34, 20F

07/30 13:19, , 21F
(小聲)其實IE也有很好用的專有語法,例如text-overflow
07/30 13:19, 21F

08/01 12:11, , 22F
我是用float left,不支援時可以出絕招HACK
08/01 12:11, 22F
文章代碼(AID): #1AS5HfTA (Web_Design)