Размер блоков в карточке товара. Проблемы с CSS

[Spein]

Здравствуйте, мною были предприняты попытки поменять размеры блоков в карточке товара. По умолчанию размеры 50\50, нужно чтобы было 65/35, со смещением блога с покупкой вправо. Блок - col-sm-6. Проблема в том, что один большой блок row разбит как раз на эти 2 col-sm-6, с одинаковыми названиями.

Пробовала играть со stylesheet, пробовала выводить элементы по отдельности - падает вся разметка, пробовала выводить с помощью селектора из инспектора - все работает, но падает разметка в плитке товаров.

С моими нулевыми знаниями css это просто убийственно. Сайт готов, осталось поправить это. Бьюсь лбом, не понимаю куда смотреть. Спасибо!

 

 

[HyperLabTeam]

так чего вы хотите в результате то?

[Spein]

Только что, AWARO сказал:

так чего вы хотите в результате то? 

 

Чтобы на десктопе вот этот блок с покупкой был меньше блока с описанием и фото товара..

[Spein]

div#product-product.container>div.row>#content.col-sm-9>div.row>div.col-sm-6 {
	width: 65%;
}

div#product-product.container>div.row>#content.col-sm-9>div.row>div.col-sm-6:nth-child(2) {
	width: 35%;
}

Сделала в stylesheet вот так, вроде на пк ничего не едет, но на мобайле все разошлось

[HyperLabTeam]

размеры фото увеличьте да и все

[Spein]

div#product-product.container>div.row>#content.col-sm-9>div.row>div.col-sm-6 {
	width: 65%;
}

div#product-product.container>div.row>#content.col-sm-9>div.row>div.col-sm-6:nth-child(2) {
	width: 35%;
}

Мало ли, кому то вдруг пригодится:

 

В итоге вставила это в bootstrap.min.css

.

1) .

col-ms-6{width:50%}

заменяем на

 

div#product-product.container>div.row>#content.col-sm-9>div.row>div.col-sm-6{width:ваша ширина}

2) Сразу после этого добавляем

 

div#product-product.container>div.row>#content.col-sm-9>div.row>div.col-sm-6:nth-child(2){width:ваша ширина}

Не претендую на правильность, т.к. в каскадке полный нуль.

 

Но это работает и не ломает адаптив.

[ocdroid]

<div class="col-sm-6 col-lg-7 col-xs-7">блок с фоткой</div>
<div class="col-sm-6 col-lg-5 col-xs-5">блок с покупкой</div>

В шаблоне.

Вот так будет правильно. Почитайте про размерную сетку бутстрапа.

А то что вы понаписывали, может где-то вылезти неприятно и неожиданно.