Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #344362

    Hey there,

    I’m most certainly not a coder and I need a bit of help!!

    I’d like to put a color section into my page, with a custom background image on it, and then pull a text block on top of that. I had no problem doing any of that…. However, when I do put it in, the color section automatically stretches to fill the whole screen, and because of this, it knocks down my side bar and just messes up the whole look of the page. You can see what I mean HERE on my homepage. (share buttons and facebook box should be at top right of slidebar).

    It there any way to make it a particular size??? And to make sure it doesn’t push down the sidebar?? Is it something to do with it being a heading…? :C

    I do understand a small bit of css / html so if code is the only way, then just fling it at me!

    This is driving me crazy so please tell me I can resize it!

    #344407

    Hey graceelizabeth!

    You are better off using a 1/1 layout container.

    Add the container and text box and let me know.

    Best regards,
    Arvish

    #344426

    Hey Arvish, that’s fine, but what about my background image then? I want to put text on top of a block of colour or background image…. that’s why I chose the colour section, so I could have a block of colour, then drag a text box on top of it…

    #344441

    Hey!

    Using the colour section will cut sidebar into two sections. My objective is to add the background color and image using CSS to the fullwidth container instead.

    Regards,
    Arvish

    #344496

    I am having this exact problem. I want the color background to be on left 2/3 as I have side elements in 1/3 to the right. But like graceelizabeth I don’t want it to split the page.

    #344553

    Arvish,

    Could you suggest an CSS for this?

    thank you :)

    #344555

    Hey!


    @graceelizabeth

    Please forward us your wordpress admin credentials for us to implement a fix.

    Regards,
    Arvish

    #344665
    This reply has been marked as private.
    #344668

    to graceelizabeth: Looks like we are at the same level of learning (I am not a coder either). I have some CSS snippets that I can share.

    #345486

    Hi!

    belonging to color section:
    add color section in avia layout builder. Open it (color section editor). Scroll down to “Section-ID”. Give it a name, for example “color-section-width” (without quotation marks). Click save. Than go to your Quick CSS and add this code:

    #color-section-width {
    position: absolute;
    width: 70.6%;
    }
    

    You may need to adjust “70.6” to a different number, so that it fits well.

    To change background of “2 WAYS TO ORDER” add this to Quick CSS:

    .alternate_color, .alternate_color .site-background, .alternate_color .first-quote, .alternate_color .related_image_wrap, .alternate_color .gravatar img .alternate_color .hr_content, .alternate_color .news-thumb, .alternate_color .post-format-icon, .alternate_color .ajax_controlls a, .alternate_color .tweet-text.avatar_no, .alternate_color .toggler, .alternate_color .toggler.activeTitle:hover, .alternate_color #js_sort_items, .alternate_color.inner-entry, .alternate_color .grid-entry-title, .alternate_color .related-format-icon, .grid-entry .alternate_color .avia-arrow, .alternate_color .avia-gallery-big, .alternate_color .avia-gallery-big, .alternate_color .avia-gallery img, .alternate_color .grid-content, .alternate_color .av-share-box ul, #top .alternate_color .av-related-style-full .related-format-icon, .alternate_color .related_posts.av-related-style-full a:hover, .alternate_color.avia-fullwidth-portfolio .pagination .current, .alternate_color.avia-fullwidth-portfolio .pagination a {
    background-color: #ffffff;
    }
    

    Instead of “#ffffff” you can use any hex color code you want.

    To make the icons bigger use this code:

    [data-av_icon]:before {
    font-size: 30px;
    }
    

    Adjust “30” to any number you want.

    Hope that helps.

    Cheers!
    Andy

    #345665

    THANKS Andy
    Is there a way to isolate the larger icons to the icon boxes on the frontpage

    • This reply was modified 10 years ago by kbarranco.
    #346529

    Hi!

    I’m sorry but if you have any additional questions at this time we kindly ask that you open them up in a separate thread The longer threads get in the forum, they become more difficult to support as they tend to drift off topic and they also make it troublesome for users trying to search for solutions. Keeping threads relevant to their original inquiry ensures that we can keep better track of what has been resolved and that users can more effectively find answers to similar issues they might be experiencing. If possible, please create your own thread.

    Thanks!

    Cheers!
    Ismael

Viewing 12 posts - 1 through 12 (of 12 total)
  • The topic ‘Color Section size help!!’ is closed to new replies.