CSS在Wordpress主題中被覆蓋

我有一個3列的div，每列設置爲包含縮略圖圖像鏈接。我已經設計了這個div - .reading-pane - 爲了適應我的設計，擁有合適的邊距和邊框。還有一個內部div - row_inner_wrapper - 由我使用的主題創建。沒有爲這個div設置寬度 - 它只能容納三個縮略圖div。但是，.row_inner_wrapper div比圖像div的總數更寬，並且使.reading-pane div伸出頁面右側。CSS在Wordpress主題中被覆蓋

我可以找到沒有造成這種使用Firebug的造型。但是，在Chrome中我可以看到，當我將鼠標懸停在此div上時，應用了右邊距，即使沒有應用這樣的樣式規則。我甚至可以在這個div上設置margin:0px !important並保留餘量。關於我的幻影CSS可能來自何處的任何建議？

您可以看到頁面在這裏http://jpsingh.samcampsall.co.uk/galleries/

HTML

<div class="reading-pane"> 
    <div class="row_inner_wrapper"> 
     <div class="row_inner"> 
      <div class="themify_builder_sub_row clearfix"> 
       <div class="col3-1"> 
       </div> 
       <div class="col3-1"> 
       </div> 
       <div class="col3-1"> 
       </div> 
      </div> 
     </div> 
    </div> 
</div>

CSS

.reading-pane{ 
background-color:#ffffff; 
background-image: url('leftcolumn.png'); 
background-repeat:repeat-y; 
margin:30px; 
padding:25px 25px 25px 103px; 
} 
.row_inner_wrapper{ 
margin:0px 0px 0px 0px !important; 
}

來源

2016-01-12 Sam Campsall

只需將下面的代碼塊的寬度設置爲auto即可。 100％超越其父母。

.themify_builder_row.fullwidth, 
.themify_builder .module_row.fullwidth, 
.full_width.sidebar-none .themify_builder .themify_builder_row { 
width: auto; 
}

來源

2016-01-12 15:19:08

Grr！過了這麼久，我撓了撓頭。謝謝！ :) –

歡迎。很高興我能幫上忙！ –

在.reading-pane問題的div你有一流的

.full_width.sidebar-none .themify_builder .themify_builder_row。

此課程有一條規則width: 100%;。當我刪除這個規則時，.reading-pane div正確定位。

來源

2016-01-12 15:15:29 pgk

正確，順便說一下'row_inner_wrapper'上沒有任何餘量，這只是Chrome的網頁檢查器不清楚。如果將'row_inner_wrapper'設置爲'display：inline-block'，則不會再顯示。 – vard

是的，我想這不是很正確。 @pgk感謝您的回答 - 圓滑極客的正確答案，僅僅因爲他們是第一個。謝謝:) –

@SamCampsall實際上pgk是第一個，看看這兩個答案都發布了:) – vard

CSS在Wordpress主題中被覆蓋

回答

相關問題