boktar (14 Октябрь 2014 - 21:35) писал:
мне не надо редактировать стиль виджета, мне надо просто, чтобы между виджититами вк и инста было расстояние такое же как между виджитом вк в верхней части и блоком каталога, а не впритык и чтобы виджет инста располагался по центру относительно виджета вк, без смещения влево.
Найдите в шаблоне html следующий код:
<!-- VK Widget --> <div id="vk_groups"></div> <script type="text/javascript"> VK.Widgets.Group("vk_groups", {mode: 0, width: "200", height: "350", color1: 'FFFFFF', color2: '2B587A', color3: '5B7FA6'}, 66703149); </script> <style>.ig-b- { display: inline-block; } .ig-b- img { visibility: hidden; } .ig-b-:hover { background-position: 0 -60px; } .ig-b-:active { background-position: 0 -120px; } .ig-b-v-24 { width: 137px; height: 24px; background: url(//badges.instagram.com/static/images/ig-badge-view-sprite-24.png) no-repeat 0 0; } @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { .ig-b-v-24 { background-image: url(//badges.instagram.com/static/images/ig-badge-view-sprite-24@2x.png); background-size: 160px 178px; } }</style> <a href="http://instagram.com/flybirdsup?ref=badge" class="ig-b- ig-b-v-24"><img src="//badges.instagram.com/static/images/ig-badge-view-24.png" alt="Instagram" /></a> <!-- www.instget.com --> <iframe src="http://www.instget.com/widget/?w=9ad471cf3e973010b09e4742d3aca62f" allowTransparency="true" frameborder="0" scrolling="no" style="border: none; overflow: hidden; width: 205px; height: 205px;"></iframe>
И замените кодом:
<!-- VK Widget --> <div class="vkgr"><div id="vk_groups"></div></div> <script type="text/javascript"> VK.Widgets.Group("vk_groups", {mode: 0, width: "200", height: "350", color1: 'FFFFFF', color2: '2B587A', color3: '5B7FA6'}, 66703149); </script> <style>.ig-b- { display: inline-block; } .ig-b- img { visibility: hidden; } .ig-b-:hover { background-position: 0 -60px; } .ig-b-:active { background-position: 0 -120px; } .ig-b-v-24 { width: 137px; height: 24px; background: url(//badges.instagram.com/static/images/ig-badge-view-sprite-24.png) no-repeat 0 0; } @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { .ig-b-v-24 { background-image: url(//badges.instagram.com/static/images/ig-badge-view-sprite-24@2x.png); background-size: 160px 178px; } }</style> <div class="vkgr"> <a href="http://instagram.com/flybirdsup?ref=badge" class="ig-b- ig-b-v-24"><img src="//badges.instagram.com/static/images/ig-badge-view-24.png" alt="Instagram" style="margin-bottom: 10px;"/></a> </div> <div class="vkgr"> <!-- www.instget.com --> <iframe src="http://www.instget.com/widget/?w=9ad471cf3e973010b09e4742d3aca62f" allowTransparency="true" frameborder="0" scrolling="no" style="border: none; overflow: hidden; width: 205px; height: 205px;"></iframe> </div>
Так же добавьте в main.css следующий код:
.vkgr { margin-bottom: 10px; }