2016-07-04 79 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