2010-12-18 97 views
0

我是一個設計師,但我有點吸吮CSS,並且似乎無法讓網站在內容更改時向右擴展。我希望你們能幫助... ...內容擴展溢出

CSS: http://pastebin.com/CasrrGe9

HTML: http://pastebin.com/WN8XhAHd

我修改了HTML與絕對路徑的圖像

+2

很難看到你沒有絕對URL的圖像說些什麼。 – 2010-12-18 07:36:33

+1

是的,如果你想改變這個,所以很容易看到會發生什麼,我敢打賭你會得到更多的答案 – 2010-12-20 10:51:13

+0

你能解釋你想要生成什麼樣的頁面。這是一種畫廊嗎?而且,我們似乎並沒有修改我的絕對路徑。 – crodjer 2010-12-20 11:06:34

回答

4

你真的需要重構所有你的CSS。

在我看來,你使用Photoshop或這樣的設計工具來設計/剪切並自動生成html/css。

如果這些做了一個正確的代碼,很多人將失去他們的工作...

這麼說,我可能是錯的,你這樣做你自己。然後,你需要學習不像設計工具的代碼;)

在你的情況,你設計absolute位置和固定widthheight

這意味着您的網頁上的每個元素都是一勞永逸的定位元素,如果元素中的內容比它的容器更寬,它將展開,但不會影響其他絕對定位的元素。

現在,你不能要求某人在這裏重構你所有的CSS。 You should start to learn it然後如果需要的話在這裏提出具體問題。

You can train here

+0

@Chouchenous,你是對的,我從來沒有見過這種手動編寫的CSS。 – crodjer 2010-12-20 11:05:17

1

我只想建議小事比如改變指數的所有的ID - ##有定位聲明一次

#index-01,#index-02,#index-03,#index-04{ 
position:absolute; 
} 

清理這一切,然後開始擔心其他的事情,否則你會在大約一個小時左右的時間內就會陷入混亂。

你不應該在所有的定位他們雖然

你應該聲明一個類,它是在所有的div的控制和浮動左:

.float_left {float:left;} 
.clear_both {clear:both} 

並應用到每個你想使用的div然後在最後清除浮動

<div class="float_left"><img src="index-1.jpg" /></div> 
<div class="float_left"><img src="index-2.jpg" /></div> 
<div class="float_left"><img src="index-3.jpg" /></div> 
<div class="clear_both"></div> 

然後divs應該自動擴展:)