If you hover your mouse around the center you’ll notice an arrow pointing left appearing and working, however I want to make it appear on the very left side of inside the image and for the arrow pointing right to appear on the very right side inside the image. Can anyone help me out? I’ve experimented but can’t seem to find the right way to code it…
Hi @ayanda! This is a really interesting little problem, and I’ve had a play with it and figured out a solution.
To start with, you’ve got the prev and next <a> elements inside the <div> with class slideshow-container. You got the <div> set with position: absolute, and the <a>s set with position: relative, and you are positioning the <a> elements with top, etc.
But you have the slideshow-container set to be much bigger than the slides, so the links won’t appear over the slides. The first thing I did was to set the container to be the same size as the slides:
/* Slideshow container */
.slideshow-container {
width: 300px;
position: relative;
margin: auto;
}
The next thing I did was to make sure the prev and next links were set on the left and right of the container:
/* Position the "prev button" to the left
and the "next button" to the right */
.prev {
left: 5px;
border-radius: 3px 0 0 3px;
}
.next {
right: 5px;
border-radius: 0 3px 3px 0;
}
And finally I set it so that the links appear when you hover anywhere over the container. the hit area for them was a bit small otherwise. Note the :hover pseudo being placed on the parent of the links, and not the links themselves:
/* On hover, add a black background color with a little bit see-through */
.slideshow-container:hover .prev, .slideshow-container:hover .next {
background-color: rgba(0,0,0,0.8);
}
Hope this helps.
That’s amazing… I kinda did something similar to what you did (I experiment and research and if I keep failing for to long, I post on a forum and continue experimenting and researching till solution comes)…
this is weird cause I feel like am not so much of a noob as when I started with the hello world project…
I have progressed to the more interesting problem of having 2 slideshows with 2 different sources of images… but the buttons on both seem to affect both slide shows instead of the ones the ones they should exclusively affect only.
I got the folder for everything in google drive if you would be up to help me solve it?
[2 slide show portfolio project](https://drive.google.com/drive/folders/1hoTg4f0xutdIPHLHuvJLv0mLuWAive5H?usp=sharing)That’s totally the right approach to learning — keep experimenting, keep trying to implement things you need for your projects, keep failing and learning from it! It seems frustrating at the time, but failing is one of the most useful things you can do! I’ve been writing CSS for over 20 years, and I think the main thing having all that experience does for you is that you just start to recognize patterns that you’ve seen before, helping you to get to the answer quicker. I think you are doing great.
I’ve not got time to look today, but let me know if you are still stuggling with the next problem tomorrow, and I’ll gladly help. It sounds to me like you’ll need a way to differentiate between the different sets of buttons, e.g. .prev1, .prev2, etc.
That’s one problem with CSS — unlike JavaScript, there is not an easy way to contain CSS just to individual components on the page. Unless you start embedding them in the page inside IFrames, which creates a load of other problems.
This is one problem that modern JavaScript frameworks have solved, and one reason why people use them such a lot these days.
Yeah but now scrapping everything I’ve done so far for those modern js framework solutions seems like taking a short cut when I need to be going th long way…
The minute you said differentiate between prev1 and prev2 my mind resonated with that. I’ll let you know tomorrow if I am still having issues and I hope you’ll have time then 
Am working on african timezones so its about noon over here.
Agreed — I wasn’t suggesting that you scrap this all now, but frameworks are a good thing to look into in the future perhaps?
Cool, where in Africa are you? I’m based in the UK, so my time zone is pretty close to yours.
2 Likes
Yes, am excited to get into frameworks once I am fully confident in the basics! I’m even taking refresher courses starting from html again lol.
I am in a country called Botswana. I spent a year in Bolton and Manchseter trying to become a “football star” lol… didn’t work out, knee injury and operation. I am enjoying programming a lot more that football though.
Here is an interview of when I was that side.
Wow, that is really interesting — thank you for sharing your story with me. I live just outside Manchester, so very near to where you were 
I have never been any good at sport, but I do play the drums pretty well — here is a YT video of my band, a mashup of studio audio, live footage, and still images: https://www.youtube.com/watch?v=ZYdoUbGLXgI
Yooo!!! This is incredible!! You guys have like an instagram page or something??
We were incredible. We split up over 5 years ago now, but you can still find all our stuff on bandcamp.
1 Like
Duuuuddddee… Don’t tell me you guys split cause of having to grow up an all that?
The site is awesome! Bookmarked it, thank you!!
Luckily not
We’d been around for nearly 20 years, and wanted to try some different things.
1 Like
Ah okay, yeah I get that! It’s like when an actor I like gets tired of playing the same role in a t.v series and goes on to do other projects… sweet!