Align top of slideshow with top of top widget in sidebar

darrylcotton · Member · Nov 4, 2015 at 10:33 am
Copy link

Add topic to favorites
Hi
I am trying to align the top of the slideshow with top of top widget in right hand sidebar. The page is under menu item “around the world”
Thanks

The blog I need help with is: (visible only to logged in users)
jsase5 · Member · Nov 4, 2015 at 11:49 am
Copy link
Howdy @darrylcotton!

In order to do this, you’ll need to past this code in your CSS:
```
.slideshow-window {
   padding-top: 0px !important;
   padding-bottom: 39% !important;
}
```
I hope this fixes you up! Have a great day!
darrylcotton · Member · Nov 4, 2015 at 8:33 pm
Copy link
Hey there jsase5. it doesn’t seem to be working?
thesacredpath · Member · Nov 4, 2015 at 9:25 pm
Copy link
@darrylcotton, first off, you have an empty paragraph above the slideshow. Open the Around the World page in the editor and remove that blank paragraph and update the page. That gets rid part of the issue. Then give the following a try. Paste it at the very bottom of your custom CSS
```
body.page-id-1346 div.slideshow-window * img {
    transform: translateY(-71%);
}
body.page-id-1346 div.slideshow-window {
    padding-bottom: 50% !important;
}
```
jsase5 · Member · Nov 4, 2015 at 9:27 pm
Copy link
@darrylcotton,

I think I see what is going on now!

In your “Edit Posts” screen, select “Edit” under your “Around the World” post.

Now, delete anything that comes before the slideshow.

It looks like you have an empty paragraph above the slideshow.
jsase5 · Member · Nov 4, 2015 at 9:28 pm
Copy link
Sorry about that @thesacredpath!

I didn’t realize you had already posted. Carry on! :)
darrylcotton · Member · Nov 5, 2015 at 5:31 am
Copy link
Thanks to both of you CSS stars!!. It has worked :)
thesacredpath · Member · Nov 5, 2015 at 5:59 am
Copy link
That’s great, @darrylcotton and you are welcome.

@jsase5, no worries, it happens to all of us. :)
darrylcotton · Member · Nov 13, 2015 at 7:47 am
Copy link
Hi. I moved the slideshow to a different page and the same problem is occurring (Top of slideshow NOT ALIGNING with top of top widget in sidebar?
I tried to paste the code previously given but its not working for some reason?
The new page with the slideshow is ‘Melton Travel Seminars’ under ‘Around the World’
Any ideas what could be the problem? Thanks
darrylcotton · Member · Nov 13, 2015 at 7:48 am
Copy link
Thanks
thesacredpath · Member · Nov 13, 2015 at 7:55 am
Copy link
@darrylcotton, given the nature of your images, I make the above code specific to the page it was on by using the unique page id defined in the opening HTML body selector on the page. You will need to look at the source code (HTML) for the page where you placed the slideshow and edit the unique page id part of the selectors.

In this case, change the 1346 to 2571 in the two rules.
thesacredpath · Member · Nov 13, 2015 at 7:56 am
Copy link
I used the web inspector built into my browser to find the relevant CSS. If you are not familiar with the web inspector in your browser, take a look at our support page on How to Find Your Theme’s CSS where you will find some brief screencasts to get you started with it. I find it an invaluable tool when working with CSS.
darrylcotton · Member · Nov 13, 2015 at 8:04 am
Copy link
Great, thanks very much for your speedy response andthe suggestions :)
thesacredpath · Member · Nov 13, 2015 at 9:01 am
Copy link
You are welcome.

No items found.