Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • April 19, 2014 at 3:34 am #253403
    elinwood

    Hi,
    I am attempting to achieve a homepage layout as shown in the following:
    http://www.arenacore.com/wp/?attachment_id=2996
    The result that I’m currently getting can be seen at:
    http://www.arenacore.com/wp/

    I’ve been looking various posts here and currently have the following in my ‘Quick CSS’ section (I’d say most of this will come out once I find what works!):
    .avia-section { min-height: inherit; }
    .avia_textblock.awesome-textblock p {
    padding-top: 0px;margin-top: 0px;
    }
    .content {
    margin-top: 0px;
    margin-bottom: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
    }
    body .column-top-margin{
    margin-top: 0px;
    }
    body {
    margin: 0px;
    padding: 0px;
    }

    The items I’m having trouble with are the coloured blocks at the bottom of the visible section of the page. I’m using a text block into which I’ve inserted the four image media elements. I’d like this element to be 100% of the page width. The second thing I want to achieve is to have the text block/images sitting immediately below the layerslider.

    Regarding the width issue I’ve seen the comments in:
    https://kriesi.at/support/topic/color-section-not-full-width-with-template-template-page-php-copy/
    https://kriesi.at/support/topic/full-width-layout-element/

    I’m not a ‘CSS person’ – any help regarding how to add the appropriate css would be much appreciated!
    I can see that the enclosing <div> tag has a class=” class=”flex_column av_one_full first avia-builder-el-1 el_after_av_layerslider el_before_av_one_third avia-builder-el-first ” attribute.

    Regarding the spacing issue I’m not sure what else to attempt here, any comments would be greatly appreciated also :)

    April 19, 2014 at 2:48 pm #253466
    Ismael

    Hey elinwood!

    Thank you for using the theme!

    Please edit the link tags inside the text block, add a css selector like “arenacore-services” for example. Replace all the instances of this code:

    <a href="?page_id=2998" class="alignnone

    with this:

    <a href="?page_id=2998" class="alignnone arenacore-services"

    Add this on Quick CSS or custom.css:

    .arenacore-services {
width: 25%;
float: left;
}

    I hope that helps.

    Best regards,
    Ismael

    April 23, 2014 at 11:47 am #254848
    elinwood

    Hi Ismael,
    Thanks very much for your help!
    In the end I’ve implemented some custom css as follows:
    .page-id-734 .template-page.content.twelve.alpha.units {
    margin: 0px;
    padding: 0px;
    }
    .page-id-734 p {
    margin: 0px;
    padding: 0px;
    }

    I found this was necessary to control the margins (restricted to only the homepage).
    The classless <p> tag took a bit of sorting out also.
    I couldn’t get the floating css to work – I know it should work but no luck so far!

  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)
  • The topic ‘Wdth plus margin/padding problem’ is closed to new replies.