Добрый день, дорогие коллеги (читатели). Сегодня поговорим, как исправить на PDP странице (карточке проекта) выравнивание полей:
Красным и серым я выделил проблемы, о которых говорю. Как видите, выравнивание основано на длине самого длинного настраиваемого поля, отображаемого в веб-части.
Для решения данной проблемы будем использовать Content Editor и jQuery.
«Отладка» в Chrome или IE
Первое, что нужно сделать, это идентифицировать элемент html. Самый простой способ сделать это — использовать функцию «Inspect Element», доступную в браузерах IE и Chrome. Вы найдете ее в меню правой кнопки мыши.
Определяем, что необходимо модифицировать.
Теперь отредактируйте страницу веб-части PDP и добавьте в нее веб-часть «Редактор содержимого» Затем просто добавьте вышеуказанный HTML-контент в источник HTML веб-части следующим образом:
Выравнивание отступов между web-частями:
<style type=»text/css»>
.ms-webpartPage-root {border-spacing: 0px !important;}
.ms-webpartzone-cell {margin: 0px !important;}
</style>
Выравнивание по ширине:
<script src=»http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js» type=»text/javascript»></script>
<script type=»text/javascript»>
$( document ).ready(function() {
$(«tr td.ms-formlabel»).width(«300px»);
})
</script>
Сравним полученный результат с первоначальным:
Удачи в ваших проектах.