Tagged: 

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • July 12, 2016 at 10:45 am #659732
    jonrouse

    Hello,
    I am currently designing a website on paper, but it will be built in Enfold.

    I would like to use the Ajax portfolio gallery, but I would like to create a gap between each entry.
    The reason that I’d like to use the Ajax gallery is that I want to get more text content in the boxes for seo purposes.
    Obviously lots of text is ugly, but maybe this could work?

    No problem if this is not possible, I just like the idea of expandable boxes, like on the Ajax portfolio.

    Cheers.

    July 13, 2016 at 11:01 am #660265
    Rikard

    Hi jonrouse,

    Not sure if that would be possible but I think it would. We will need to inspect the elements in question in order to give you accurate CSS though, maybe you could get back to us once you have something we can look at?

    Thanks,
    Rikard

    July 13, 2016 at 11:54 am #660309
    jonrouse

    Sure, thanks for getting back to me Rikard. Once I have a development site up, I’ll drop a link in the thread.

    July 13, 2016 at 1:29 pm #660381
    Yigit

    Hey!

    We will keep the thread open and wait to hear from you. Thread will be on hold until you reply, please reply when you would like to reopen the thread :)

    Best regards,
    Yigit

    September 27, 2016 at 11:35 am #692135
    jonrouse

    Hi,

    Finally re-opening this one. I have set up a couple of generic entries on the linked page. I would like to do two things:

    1) Make the background white
    2) Put a 10px white gap in-between each of the entries

    Is this possible and could you help me with the CSS?

    Many thanks

    EDIT
    I was able to get a white gap by using the following CSS

    #top .no_margin.av_one_third {
    border-radius: 0px;
    border: 10px solid white !important;
}

    A couple of things resulted from this
    A) the sortable area seems to be outside the colour section, I would like to move it down
    B) I want the grey area behind the names to white
    C) Is there any way to format the names within the grey area – i.e. make left aligned etc

    Thanks for you patience!

    • This reply was modified 8 years, 2 months ago by jonrouse. Reason: Additional issues raised
    September 27, 2016 at 2:06 pm #692230
    jonrouse

    Hello! Yet again, I seemed to have been able to achieve what I wanted using previous advice you’ve provided. However, as I’m no expert, I’d appreciate someone checking the code to make sure I’ve not messed up and potentially breaking something elsewhere!

    #top .no_margin.av_one_third {
    border-radius: 0px;
    border: 10px solid white !important;
}
.grid-content { background: #fff !important; }
.grid-entry-title { background: #fff !important; }
.avia-arrow { background: #fff !important; }
.main_color #js_sort_items { background: #fff !important; }
    September 30, 2016 at 12:54 am #693446
    Josue

    Hi,

    It may affect other elements, to isolate this change you can do it by setting a custom ID to the containing Color Section and changing the code accordingly:

    #custom_section .no_margin.av_one_third {
    border-radius: 0px;
    border: 10px solid white !important;
}
#custom_section .grid-content { background: #fff !important; }
#custom_section .grid-entry-title { background: #fff !important; }
#custom_section .avia-arrow { background: #fff !important; }
#custom_section #js_sort_items { background: #fff !important; }

    Best regards,
    Josue

    September 30, 2016 at 10:35 am #693588
    jonrouse

    Thanks Josue,

    I couldn’t get it to work using the # symbol. I called the custom color section “.people”
    Also, the #js_sort_items wouldn’t work with the custom ID. I ended up using the following.

    .people .no_margin.av_one_fourth {
    border-radius: 0px;
    border: 6px solid white !important;
}
.people .grid-content { background: #fff !important; }
.people .grid-entry-title {  background: #fff !important; }
.people .avia-arrow { background: #fff !important; }
.main_color #js_sort_items { background: #fff !important; }

    I’m guessing that if I use a JS Sort Items again it’s going to have a white background everywhere?

    Thanks again,

    September 30, 2016 at 10:37 am #693590
    jonrouse

    Sorry, I’m an idiot! I just noticed that I left .main_color on the final line! All sorted now. Thanks Josue!!!!

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • You must be logged in to reply to this topic.