2016-07-04 82 views
0

我在客戶wordpress網站上用字間距很難。他們在flexbox中有一段內容,但詞間距只是搞砸了,調整網站大小並沒有讓它變得更好!字間距有很多空格間隔

screenshot from website

我得到了正確的道路上慢,但我似乎無法在目前的數字出來我自己。有人可以解釋爲什麼字間距太亂了嗎?

這是從左側箱(它們使用的達姆視覺創建者插件VC)

<h4>Bedrijfsleven</h4> 
[/vc_column_text][vc_separator type="transparent" up="5" down="0"]  
[vc_column_text] 
<p style="text-align: justify;">SpaanIt geeft incompany-groepstraining 
en privéles in het Spaans en Italiaans op maat. In overleg wordt het 
huidige taalvaardigheidsniveau bepaald en waar de nadruk op komt te 
liggen tijdens de taallessen. Dat kan bijvoorbeeld Spaanse of Italiaanse 
spreekvaardigheid, schrijfvaardigheid en grammatica zijn. Daarnaast 
besteed SpaanIt aandacht aan cultuurverschillen en jargon.</p> 

<p style="text-align: justify;">Ook biedt SpaanIt één-op-één 
VIP-arrangementen voor lessen Spaans of Italiaans. Er wordt dan van ’s 
morgens tot ’s avonds intensief op een afwisselende manier gewerkt aan 
de taalvaardigheid. VIP-arrangementen vinden bij voorkeur plaats op een 
speciale locatie inclusief lunch en diner.</p> 
[/vc_column_text][vc_separator type="transparent" up="15" down="0"] 
[button size="small" icon="" target="_self" font_style="normal" 
font_weight="500" text_align="center" text="lees meer" 
link="http://www.spaanit.nl/bedrijven/" hover_color="#2f9738" 
border_color="#f9af00" hover_border_color="#2f9738" margin="20px 10px 
20px 5px" border_radius="25" color="#f9af00" background_color="#ffffff" 
hover_background_color="#ffffff"][/vc_column_inner][vc_column_inner 
width="1/4"][vc_single_image image="18394" img_size="260x250" 
qode_css_animation=""][vc_separator type="transparent" thickness="5"] 
[vc_column_text css=".vc_custom_1454448677436{padding-top: -20px 
!important;}"] 

我已經嘗試只是固定字間距

word-spacing: normal !important; 

但是,如果沒有結果的代碼。

+2

由於您使用的是「text-align:justify」,因此您的單詞間距不均勻。對齊文本的間隔方式是,一行的第一個和最後一個字分別在左邊和右邊對齊。該行中的其餘單詞將均勻分佈。每行被視爲一個單獨的實體,這意味着行間的字間距會有所不同。 TL; DR使用'text-align:left;' – Turnip

回答

1

的原因有在內容這麼多空格事實上,元素的text-align屬性設置爲justify,這可以確保文本元素的每一行的最右邊和最左邊完美對齊。

您應該用替換爲text-align: left;或稍微更改內容,以使其更適合更少的空格。

3

這個空間不是因爲white spacing而是因爲你有內嵌樣式text-align:justify;,你應該從p element刪除它,也可以添加到您的風格來覆蓋它

text-align: initial !important; 
+0

「left」原來是我最好的解決方案,但我仍然感謝你 – Koenman