1 Answer

0 votes
by (423 points)

Just copy this code bellow and paste in your webpage in html format. Then edit your text and save then publish.

<style type="text/css">

.news-container {

    position: relative;

    top: 0;

    left: 0;

    right: 0;

    font-family: "Roboto", sans-serif;

    box-shadow: 0 4px 8px -4px rgba(0, 0, 0, 0.3);

}

.news-container .title {

    position: absolute;

    background: #df2020;

    height: 100%;

    display: flex;

    align-items: center;

    padding: 0 24px;

    color: white;

    font-weight: bold;

    z-index: 200;

}

.news-container ul {

    display: flex;

    list-style: none;

    margin: 0;

    animation: scroll 25s infinite linear;

}

.news-container ul li {

    white-space: nowrap;

    padding: 10px 24px;

    color: #494949;

    position: relative;

}

.news-container ul li::after {

    content:"";

    width: 1px;

    height: 100%;

    background: #b8b8b8;

    position: absolute;

    top: 0;

    right: 0;

}

.news-container ul li:last-child::after {

    display: none;

}

@keyframes scroll {

    from {

        transform: translateX(100%);

    }

    to {

        transform: translateX(-1083px);

    }

}

</style>

    

    <!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

    <link rel="stylesheet" href="style.css">

</head>

<body>

    

    <div class="news-container">

        <div class="title">

            Breaking News

        </div>

        <ul>

            <li>

                Write your text here

            </li>

            

            <li>

                Write your text here

            </li>

            <li>

                Write your text here

            </li>

        </ul>

    </div>

</body>

</html>

Related questions

294 questions

75 answers

2 comments

5,034 users

2 Online Users
0 Member 2 Guest
Today Visits : 1788
Yesterday Visits : 3468
Total Visits : 6547355
...