-
AuthorPosts
-
August 1, 2017 at 7:19 pm #833033
But in the wordpress HTML editor looks good like one picture =(
(I know that they are two images forming one)
I understand it’s a css problem… putting a space between each image
How can I get it out?@media only screen and (max-width: 990px) { .only-dt { display: none !important; }} @media only screen and (min-width: 768px) { #header .widget { display:none; } } #header .widget { left: 90%; padding-top: 3; position: absolute; top: 1; transform: translate(-40%); z-index: 999; } @media only screen and (max-width: 767px) { #header .widget { left: 50%; position: absolute; top: -20px; transform: translate(0%); } } .single-product div.product .woocommerce-product-gallery { margin-bottom:2.617924em; margin-top:0; } .single-product div.product .woocommerce-product-gallery { position:relative; } .single-product div.product .woocommerce-product-gallery .woocommerce-product-gallery__trigger { position:absolute; top:.875em; right:.875em; display:block; height:2em; width:2em; border-radius:3px; z-index:99; text-align:center; text-indent:-999px; overflow:hidden } .single-product div.product .woocommerce-product-gallery .woocommerce-product-gallery__trigger:before { font:normal normal normal 1em/1 FontAwesome; font-size:inherit; text-rendering:auto; -webkit-font-smoothing:antialiased;- moz-osx-font-smoothing:grayscale; display:block; content:"\f00e"; line-height:2; text-indent:0 } .single-product div.product .woocommerce-product-gallery .woocommerce-product-gallery__trigger img{ display:none!important } .single-product div.product .woocommerce-product-gallery img{ margin:0 } .single-product div.product .woocommerce-product-gallery .flex-viewport{ margin-bottom:1.618em } .single-product div.product .woocommerce-product-gallery .flex-control-thumbs{ margin:0; padding:0 } .single-product div.product .woocommerce-product-gallery .flex-control-thumbs:after,.single-product div.product .woocommerce-product-gallery .flex-control-thumbs:before{ content:""; display:table; } .single-product div.product .woocommerce-product-gallery .flex-control-thumbs li{ list-style:none; margin-bottom:1.618em; cursor:pointer; } .single-product div.product .woocommerce-product-gallery .flex-control-thumbs li img { opacity:.5; -webkit-transition:all,ease,.2s; -moz-transition:all,ease,.2s; transition:all,ease,.2s } .single-product div.product .woocommerce-product-gallery .flex-control-thumbs li img.flex-active,.single-product div.product .woocommerce-product-gallery .flex-control-thumbs li:hover img{ opacity:1 } .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-2 .flex-control-thumbs li{ width:42.8571428571%; float:left; margin-right:14.2857142857%; } .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-2 .flex-control-thumbs li:nth-child(2n){ margin-right:0 } .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-3 .flex-control-thumbs li{ width:23.8095238%; float:left; margin-right:14.2857142857%; } .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-3 .flex-control-thumbs li:nth-child(3n){ margin-right:0; } .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-4 .flex-control-thumbs li{ width:14.2857142857%; float:left; margin-right:14.2857142857%; } .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-4 .flex-control-thumbs li:nth-child(4n){ margin-right:0; } .single-product div.product .images .woocommerce-main-image{ margin-bottom:1.618em; display:block; } .single-product div.product .images .thumbnails a.zoom{ display:block; width:22.05%; margin-right:3.8%; float:left; margin-bottom:1em; } .single-product div.product .images .thumbnails a.zoom.last{ margin-right:0; }
August 2, 2017 at 6:42 am #833195i delete all of the css and didnt work =(
August 2, 2017 at 10:48 am #833318Hi,
I’m not sure if you want that look or you don’t want it? Anyhow, that is not something which is part of the theme so it would need a custom solution. If you should need any help then please post a link to where we can see the element in question.
Best regards,
RikardAugust 3, 2017 at 6:54 pm #833976I do not want to have the blank separation between one photo and another
Which is predetermined in the css
To have the images look like a single imageAugust 5, 2017 at 7:03 am #834603Hi,
Thanks for that. Please try the following in Quick CSS under Enfold->General Styling:
p .img-responsive { margin:0 !important; padding:0 !important; }
Best regards,
RikardAugust 8, 2017 at 2:57 am #835661works =)
August 9, 2017 at 4:26 am #836110 -
AuthorPosts
- You must be logged in to reply to this topic.