Can't get scrolling photos using CSS

[Leea]

I want scrolling photos on the main page. I created my own test web page with 'HTML' and CSS on my comuter and it does just what I want. So I copied the CSS code into Main-Style.css and put the 'HTML' in an embed box. I see the pictures but they don't scoll.

I admit I am not a CSS expert, in fact I don't know much. I stole and adapted the code I am using and don't fully understand it, but it does work on my computer with the web page I created.  I am new to this, I don't know if it is correct to post CSS in this question but I put it below. I tried publishing my page and I get a scroll bar at the bottom but only see the first two and a half photos.

Are there CSS functions that are not supported?

thanks

Lee

.

#container {
    width: 1000px;
    height: 500px;   
    overflow: hidden;
    margin: 50px auto;
    background: #999;
}
h1{
    font:Tahoma, Geneva, sans-serif;
    font-size:24px;
    text-align:center;
}
.photobanner {
    height: 233px;  
    width: 8000px;  
    margin-bottom: 80px;
    background:#fff;
}
.first {
    -webkit-animation: slide 30s linear infinite;  
       -moz-animation: slide 30s linear infinite;
        -ms-animation: slide 30s linear infinite;
         -o-animation: slide 30s linear infinite;
            animation: slide 30s linear infinite;
}
 
@keyframes slide {
 0% {
    margin-left: 0px;
 }
 100% {
    margin-left: -4457px;  
 }
 
}
 
@-moz-keyframes slide {
 0% {
   margin-left: 0px;
 }
 100% {
   margin-left: -4457px;
 }
 
}
 
@-webkit-keyframes slide {
 0% {
   margin-left: 0px;
 }
 100% {
   margin-left: -4457px;
 }
 
}
 
@@-ms-keyframes slide {
 0% {
   margin-left: 0px;
 }
 100% {
   margin-left: -4457px;
 }
 
}
 
@-o-keyframes slide {
 0% {
   margin-left: 0px;
 }
 100% {
   margin-left: -4457px;
 }
 
}

[Bernadette3]

Hi there. Can you also post a link to your live site?

[Leea]

I published it so here.

leewghctest.weebly.com

Lee

[Bernadette3]

I'm wondering if there is a component missing based on the original program you used. You said you created it on your computer? What type of software was it? Or where did you test it when it worked out okay? It would be helpful if we could see it in action some how. 

---

@Leea wrote:
I want scrolling photos on the main page.

---

---

Do you mean a slideshow with a horizontal slider? Or does the code make your images scroll vertically? Now that I'm thinking of it, there's probably an app or third party embed code that might be easier for what you are trying to do. Thanks in advance for giving us more info regarding this.

[Leea]

I don't have a way to post my working model, I just wrote it on my comuter and can demo it only locally. I can give you the code and it would work except for not having the pictures. It is a continous scroll that goes off to the left and comes in from the right and repeats over and over.

I have given up on this. I now have it working where it just flips from one picture to the next without scrolling. I will use that instead.

Lee