Вторые строки залезают на название свойства

[Armi]

Друзья! Нужна помощь!
Помогите решить мелкую проблему с отображением характеристик.

 

Если тип свойства (описание) длинное и занимает 2 строки то вторая строка переползает под название свойства.

 

 

Как сделать чтобы вторая строка неуходила за зеленую линию?

[Rash]

  В стилях 'style.css' увеличить 'width: 40%'

.product .features label {
font-style: normal;
display: block;
width: 40%;
float: left;
}

[ps-simpla]

лучше использовать табличную верстку

[Armi]

 

  В стилях 'style.css' увеличить 'width: 40%'

.product .features label {
font-style: normal;
display: block;
width: 40%;
float: left;
}

не помогло, начало описания сместилось вправо

[Armi]

лучше использовать табличную верстку

 

Предлагаете верстать в ручную? Мы добавляем свойства товаров, как изначально Симпла нам предлагает. Но из-за длинных описаний свойств возникла такая проблема...

[hrusha]

.product .features SPAN {

    display: block;

    float: left;

    width: 59%;

}

 

Это решение мне когда то подсказал  Kosjak76   За что ему большое спасибо. . Видимо я его опередил, а так бы он написал сам

[chocolate_moles]

Предлагаете верстать в ручную? Мы добавляем свойства товаров, как изначально Симпла нам предлагает. Но из-за длинных описаний свойств возникла такая проблема...

 

в шаблоне, в файле product.tpl замените 

 

{if $product->features}   
<!-- Характеристики товара --> 
<h2>Характеристики</h2> 
<ul class="features">  
{foreach $product->features as $f} 
<li>     
<label>{$f->name}</label>      
<span>{$f->value}</span>  
</li>   
{/foreach}  
</ul>  
<!-- Характеристики товара (The End)-->{/if}

на

{if $product->features}   
<!-- Характеристики товара --> 
<h2>Характеристики</h2>  
<table class="features">  
{foreach $product->features as $f}   
<tr>      
<td>{$f->name}</td>   
<td>{$f->value}</td>  
</tr>
{/foreach} 
</table>  
<!-- Характеристики товара (The End)-->
{/if}

в стили можно добавить следующее

.features td{
padding: 5px 10px;
vertical-align: top;
}
.features tr:nth-child(odd) td {
background: #ECECEC;
}
 

[Armi]

 

 

в шаблоне, в файле product.tpl замените 

 

{if $product->features}   
<!-- Характеристики товара --> 
<h2>Характеристики</h2> 
<ul class="features">  
{foreach $product->features as $f} 
<li>     
<label>{$f->name}</label>      
<span>{$f->value}</span>  
</li>   
{/foreach}  
</ul>  
<!-- Характеристики товара (The End)-->{/if}

на

{if $product->features}   
<!-- Характеристики товара --> 
<h2>Характеристики</h2>  
<table class="features">  
{foreach $product->features as $f}   
<tr>      
<td>{$f->name}</td>   
<td>{$f->value}</td>  
</tr>
{/foreach} 
</table>  
<!-- Характеристики товара (The End)-->
{/if}

в стили можно добавить следующее

.features td{
padding: 5px 10px;
vertical-align: top;
}
.features tr:nth-child(odd) td {
background: #ECECEC;
}
 

 

Спасибо огромное )) Все заработало!