How do I make my
stay in one position while I move the page around

Question

I have been trying and I can't get this to stay:

<marquee>
  <p>
    <div class="scroll-left" id="page" position="fixed" left="0" right="0" top="0" height="83px">
      This is made by an organization
      <br />
      <strong>DO NOT COPY!</strong>
      <br />
      <hr />
    </div>
  </p>
</marquee>

If you need the element to remain relative to the viewport then declare `position: fixed` - it'll will remove the element in question out of the normal document flow. — UncaughtTypeError, Oct 20 '17 at 20:04
`position` is a CSS property, not an HTML attribute. And `height"83px"` is missing a `=`. — Sebastian Simon, Oct 20 '17 at 20:05
To add to what Xufox said, you'd do `style="position:fixed"` and not `position="fixed"`. Also note that the `` no longer exists — j08691, Oct 20 '17 at 20:06

score 2 · Accepted Answer · edited May 01 '19 at 11:34

Using the marquee tag is not standard. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/marquee

Also I would avoid to wrap a div with a p tag as it's semantically not correct and are supposed to contain only inline elements.

I would separate the styling from the div tag. and do something like this: https://jsfiddle.net/Mehdikit/bs9shwt0/

HTML & CSS

.container {
  position: relative;
  height: 2000px;
}

.scroll-left {
  position: fixed;
  right: 0;
  top: 0;
  height: 83px;
}

<div class="container">
  <div class="scroll-left" id="page">
    <p>This is made by an organization </p>
    <br />
    <strong>DO NOT COPY!</strong>
    <br />
    <hr />
  </div>
</div>

Note that I put a height of 2000px for the purpose of the example, so we can scroll :)

I hope this helped.

score 1 · Answer 2 · edited Oct 20 '20 at 07:36

Check out the code below.

#page {
  position: fixed;
}

<marquee id="page">
  <p>
    <div class="scroll-left" right="0" top="0" height"83px">
      This is made by an organization
      <br />
      <hr>
      <strong>DO NOT COPY!</strong>
    </div>
  </p>
</marquee>

<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />

Layne Faler · Answer 3 · 2017-10-20T20:17:39.277

1

You are going to want to give that div a fixed position and set the position with top, left, right, and/or bottom properties. These properties are style properties.

Make sure you give that div a height and a width. I don't see a width inside your code.

In CSS you should have some thing like this:

#page {
  position: fixed;
  right: 0;
  top: 0;
}

I hope that helps

edited Oct 20 '17 at 20:17

answered Oct 20 '17 at 20:11

Layne Faler

101
2
4

`z-index` is not applicable on `fixed` elements, it always creates a new stacking context (no `z-index` property required) - just a heads up! **position CSS | MDN** https://developer.mozilla.org/en-US/docs/Web/CSS/position#fixed – UncaughtTypeError Oct 20 '17 at 20:17

score 0 · Answer 4 · 2017-10-20T20:24:11.187

Instead of position="fixed" use style="position:fixed;"

position is a css property, not a html attribute.

    <marquee>
        <p>
            <div class="scroll-left" id="page" style="position:fixed;right:0;top:0;height:83px;">
                This is made by an organization
                <br />
                <strong>DO NOT COPY!</strong>
                <br />
                <hr />
            </div>
        </p>
    </marquee>

How do I make my stay in one position while I move the page around

4 Answers4

How do I make my
stay in one position while I move the page around