Viewing 30 posts - 1 through 30 (of 37 total)
  • Author
    Posts
  • #595611

    I have 3 Columns. One Image in each colum using the caption to put type over the top (red type). I am looking to maintain the spacing I have on the top and on the left and right of the Color section these columns are in but have no spacing on the inside of the images. Attached is a screenshot with arrows point to the only area I want no spacing..

    #595627

    Hi sublime5o!

    Can you please post the link to your page? Have you tried using Grid Row element?

    Cheers!
    Yigit

    #595636

    Wish I could. This is on a local site. I am basically use a Color Section and then within that 3 columns and a single image in each column. I have tried the grid. Same issue with that.

    #595649

    Hi!

    Please edit your Color Section element that has your 3 columns inside and give it a unique ID – http://kriesi.at/documentation/enfold/wp-content/uploads/sites/2/2013/12/color-section-ID.png and then add following code to Quick CSS in Enfold theme options under General Styling tab

    #your-unique-id .av_one_third {
        margin: 0!important;
        width: 33.3%!important;
    }

    Cheers!
    Yigit

    #595657

    I added this and it basically looks the same the inner spacing is still the same. If I change the width to 29% or something in width then they loose the spacing but then it is not centered.

    #595669

    Hi!

    Can you please try adding following code as well

    #your-unique-id .av_one_third * {
    padding: 0 !important; 
    }

    Regards,
    Yigit

    #595673

    That did not help either. No change at all.

    #595675

    Hi!

    If that is the case, i am afraid we are going to need to see your website live. Please let us know when you launch it.

    Best regards,
    Yigit

    #595677

    OK..??? Did you even try to replicate this on a testing site? If so please let me see the URL you have so I can see what is going on.

    #595681

    Hey!

    Please try adding following code to Quick CSS as well

    #your-unique-id .avia-image-container * {
        width: 100%;
    }

    Best regards,
    Yigit

    #595693

    Thanks! That got them pushed together with no spacing. I had to add a -90px margin-top to get the top margin like i needed it but it is still missing the right and left side margin/spacing that is needed (see link). Here is the code I added so far.

    #home-hero .av_one_third {
    margin: 0!important;
    margin-top: -90px !important;
    width: 33.3%!important;
    }

    #home-hero .avia-image-container * {
    width: 100%;
    }

    #595725

    Hey!

    Please add following code to Quick CSS as well

    #home-hero .content { padding: 50px; }

    Cheers!
    Yigit

    #595734

    Thanks but this did nothing, i tried to apply !important to it but it just moved it off center.

    #597876

    Hey!

    can you provide us a link to your site showing the elements in question please? we need to be able to inspect the elements.

    Cheers!
    Andy

    #597893

    Below is a link… You will see the middle image is not the same size as the other two. That is the only issue right now..

    #599678

    Hey!

    Can you provide us admin access to have a deeper look into it? Check if your images have the same sizes in your backend. Post login details here as private reply.

    Cheers!
    Andy

    #599693

    Images are all the same size. Below is the access you requested.

    #599762

    Hi!

    it is caused by your section ID “home-hero”. If I remove it then it’s working as expected.

    Cheers!
    Andy

    #599795

    What are you talking about? If you remove home hero you basically get 3 images with padding next to each other. I have been told previous in this post to add specific styles. Please look at the rest of the ticket/post here to fully understand.

    #599802

    Hey!

    I tried to check you Quick CSS field, but can’t find any custom code in it. We need to check which values you provided to your home-hero, cause it seems to me that you added more than Yigit provided to you in his code. Where did you put your custom code?

    Cheers!
    Andy

    #599824

    I added it to style.css (which if you inspect you should easily be able to find out). I added some extra values (but you told me to remove home-hero completely) so it would match what i needed (based on the first screenshot I provided).

    #599832

    Hey!

    so you are using lots of custom code for you home hero. Remove all of it. Then add them one by one to check which one is causing this issue.

    Regards,
    Andy

    #599847

    Ok. I did as you suggested (which I did previously but it did not look like the screenshot of the mockup I am trying to replicate). Here is what it looks like now. If you see what the homepage looks like now it is missing the left and right padding areas of the image column and the top (referenced: http://www.awesomescreenshot.com/image/1065613/aba6e8ababba2df65e68bc44053d6aae).

    #600309

    Hi!

    alright, thanks for the screenshot. Now try to add this code:

    #home-hero .av_one_third * {
    margin-right: 30px;
    }
    

    and adjust as needed.

    Best regards,
    Andy

    #600320

    Andy,

    I added this. This is not what i need. Please, again, review the entire ticket. I do not think you totally understand what I am looking for. The first post I made with the screenshot is what I need (images right next to each other no padding/margin but with spacing around the outside of the images column). I am not sure how much further I can try to explain, since this has been going on for almost 2 weeks.

    #600339

    Hi!

    please make it easy and clear for us. We have hundred of open tickets and waiting customers each day. If you want a precise code then simply send us a mockup showing exactly the results you want to achieve. I though your last screenshot is what you want to achieve …

    Best regards,
    Andy

    #600341

    I DID. I sent in the first post I made. I understand you have many tickets, but this is the problem when you do not read the entire thread and several different people are answering the same tickets. PLEASE SEE MY FIRST POST.

    #600394

    Hey!

    I haven seen this screenshot already. My last code provides you exactly this solution and it works fine. You did not use it inside your Quick CSS field, that’s why I put it there now. Now your website looks exactly as your screenshot/mockup from your first post.

    Cheers!
    Andy

    #600397

    Hey!

    if you want to change caption position use this code as well:

    #home-hero .av-image-caption-overlay-center p {
    margin-left: 40px;
    }
    

    and adjust as needed.

    Cheers!
    Andy

    #600415

    I have to apologize as I thought I posted my mock up in the very beginning (was a little bit ago though) but I posted what I had and typed the description of what I wanted. Here is an actual mock up of what I am trying to do. Again sorry for the confusion.

    http://www.awesomescreenshot.com/image/1093669/3c5c54ffc4ef68e5cc41f106d64dc0b2

Viewing 30 posts - 1 through 30 (of 37 total)
  • The topic ‘3 Columns, Image in each no spacing on the inside of the images’ is closed to new replies.