Re: [問題] 文章置中

看板Web_Design作者 (米奧)時間11年前 (2014/11/07 13:58), 11年前編輯推噓3(3011)
留言14則, 4人參與, 最新討論串2/2 (看更多)
要改的東西有點多只好回文佔一下版面.. 首先不是很清楚你要置中的部分到底有哪些,因為從我的大螢幕上看整個都是偏的: http://ppt.cc/ThKP 所以我先假設你是想把整個網站的內容置中,請改 #container {...} 裡面的部分,找到這兩個值並且改成 auto,也就是: margin-left: auto; margin-right: auto; 這樣改完你整個網頁的內容才會置中。(不過上面米的圖片需要重新定位) 但是內文部分還是靠左的,要調整這部分請找到: #container .posts {...} 把裡面的 left 和 right 屬性都拿掉。 並且找到 #container .box {...} 裡面的 float 刪掉,然後 margin 改成: margin: 50px auto 0; 這樣你的內文就置中了。 可是我忍不住還要說但是這樣你的 menu 還是沒有置中, 請找到: #container .header {...} 把裡面的 margin 改成: margin: 5px 0; 還有 #container .description 的 width 刪掉。 這樣你的 menu 才會是正確的。 ※ 引述《livein ( Livein)》之銘言: : 調了很久的CONTAINER仍然無法成功, : 所以想請教一下板上大大, : 現在我的首頁部分是可以置中的 : http://imageshack.com/a/img673/2442/47KCUE.jpg
: 但是點進去文章他就偏掉了 : http://imageshack.com/a/img633/1807/LtIukI.jpg
: 看了一下編輯語法比較相關的應該就這兩個 : http://imageshack.com/a/img743/2486/OLjZRY.jpg
: 不知要再加上什麼呢? : 謝謝! -- -- ※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 1.34.108.195 ※ 文章網址: http://www.ptt.cc/bbs/Web_Design/M.1415339891.A.950.html ※ 編輯: miau (1.34.108.195), 11/07/2014 14:01:04

11/07 14:16, , 1F
謝謝你!!!!!!!!!!!!!!!!!!
11/07 14:16, 1F

11/07 14:16, , 2F
我試了一下大概都可以了 但是現在首頁的文章不是橫的排列
11/07 14:16, 2F

11/07 14:17, , 3F
變成直的
11/07 14:17, 3F

11/07 14:56, , 4F
我看起來是你首頁的每個.box的區塊自己寫了行內樣式
11/07 14:56, 4F

11/07 14:56, , 5F
把它們都定位到直的排列去了才變成直的的...
11/07 14:56, 5F

11/09 14:50, , 6F
http://pastebin.com/B8xVbKij 要做gridview可以這樣做
11/09 14:50, 6F

11/09 14:50, , 7F
你的問題是首頁跟內文共用css導致互相汙染吧?
11/09 14:50, 7F

11/09 15:24, , 8F
原本首頁的box的float grid排版,會導致內文置中失效
11/09 15:24, 8F

11/09 15:25, , 9F
拿掉float後,卻又反而造成首頁grid失效
11/09 15:25, 9F

11/09 15:25, , 10F
最簡單解就是把css分開
11/09 15:25, 10F

11/10 06:50, , 11F
對對!!我也覺得是因為共用的關係 一個對 一個就錯 T T
11/10 06:50, 11F

11/10 06:51, , 12F
寫網頁也太難了吧!!!!!!!!!!!!!!!!!!!!!!!!!!!!
11/10 06:51, 12F

11/10 10:49, , 13F
推原OP,另外,原原PO只要有好的觀念就不難。
11/10 10:49, 13F

11/10 10:50, , 14F
網頁跟CSS還不算程式,已經很簡單了。
11/10 10:50, 14F
文章代碼(AID): #1KN5zpbG (Web_Design)
討論串 (同標題文章)
本文引述了以下文章的的內容:
問題
9
24
完整討論串 (本文為第 2 之 2 篇):
問題
9
24
文章代碼(AID): #1KN5zpbG (Web_Design)