• Resolved KconleyK

    (@kconleyk)


    at https://www.AverageGuyGolf.com the main body and side bars are not exactly centered in the middle of the page, they are offset very slightly. So when I added my slide scroller plugin I can’t get it to align properly and it looks out of place.

    Does anyone know in my page.php how I can make the code for the slider line up at a certain pixel point or measurement rather than just center it like it is now?

    Also what is the best way to figure out at what pixel point or measurement I should start it at?

Viewing 14 replies - 1 through 14 (of 14 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    hang on

    Thread Starter KconleyK

    (@kconleyk)

    I am not sure what you are saying, where should I add that? and what exactly will that accomplish? Is that making my two side bars a little smaller?

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    It’s hard to pinpoint what you’re talking about, “they are offset very slightly”.
    Are you looking at the white gap above the left and right sidebars?

    This can be solved by adding
    margin-top: -10px; to .left_sidebarand .right_sidebar

    Thread Starter KconleyK

    (@kconleyk)

    No I am not talking about that, but that is something good to know, thank you. Where would I add that, to the page.php?

    What I am talking about is the slider, with the rotating images. Do you see how on the left side of it, it doesn’t line up with the template and on the right side it over hangs the middle area of the template. Right now it is aligned to <center> and that is where it appears, so the main area must not be centered perfectly in template, how do I get the slide to line up with the template so it doesn’t go into the background and look crappy.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    That would be added to style.css
    .right_sidebar (line 332)
    and
    .left_sidebar (line 437)

    Your center over-hanging problem is actually correctly centred. The slide is in the center of the page, however the main area isn’t, therefore giving this off-set appearance.

    The slideshow is in addition too big for the main area, so even if it was centred correctly, it would still over-hang either side, as seen here https://awesomescreenshot.com/018c0pb4c.

    Thread Starter KconleyK

    (@kconleyk)

    I like your screen shot a lot better than the current look, it at least over hangs on equal sides of the template and makes it look centered. How did you do that?

    Thanks for all of your help

    Thread Starter KconleyK

    (@kconleyk)

    Hopefully you are still online and can tell me how you made the slider align that way because it looks SO much better.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Add
    margin-left: -24px to your <center> element.

    To line 160 of the same page, in which the slider is in.

    Thread Starter KconleyK

    (@kconleyk)

    margin-left: -24px .aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;

    Like that? I found that in my style.css and added what you had above.

    Thread Starter KconleyK

    (@kconleyk)

    Nevermind the above didn’t work.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    the exact code you need to add is

    center{
    margin-left: -24px;
    }

    to line 160

    Thread Starter KconleyK

    (@kconleyk)

    Sorry to be a hassle but that centered everything on the page, so the slider image is now perfect but everything else on the page is centered, so the side bar information is in the normal post area.

    Thread Starter KconleyK

    (@kconleyk)

    I got it, I pasted it wrong. Thank you very much for your help. It is greatly appreciated.

    Now do you know much about the drop down menu plugin, hahaha.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Try

    center > #wpcontent_slider_container {
    margin-left: -24px;
    }

    to only apply the margin-left to the <center> tag that has the content slider

    What’s wrong with your dropdown menu plugin?

Viewing 14 replies - 1 through 14 (of 14 total)
  • The topic ‘Aligning pictures at a certain pixel or measurment not just left, right center’ is closed to new replies.