Welcome guest. Before posting on our computer help forum, you must register. Click here it's easy and free.

Author Topic: Reposition arrow?  (Read 1320 times)

0 Members and 1 Guest are viewing this topic.


    Topic Starter


    Thanked: 2
    Reposition arrow?
    « on: December 11, 2018, 01:43:46 PM »

    I have a full-screen movie in a Web page that looks like this (please see attached).

    I am trying to relocate the downward facing arrow now above the Play button to where I have painted on the yellow star, but
    it's proving a bit difficult.

    I have the downward pointing arrow in a footer below 'class content' and 'class content_heading':

    Code: [Select]

    <div class="content">
         <h1 class="content__heading">Welcome To Home Flix</h1>


       <a href="#one" class="button style2 down">More</a>


    The CSS for the above properties is:

    Code: [Select]
    html, body, div, h1, p, a, video {
        margin: 0;
        padding: 0;

    html, body {
        height: 100%;

    .content {
        position: relative;
        top: 30%;
        z-index: 2;
        max-width: 720px;
        text-align: center;
        margin: 0 auto;

    .content__heading {
        margin-top: -18%;
        color: #94e8e3;
        font-size: 44px;

    I have stripped some styling aspects of the footer/arrow to make for easier reading:

    Code: [Select]
    footer {

    margin-top: 2em;

    Thanks for any suggestions.