Cat painting step 9

[bmc]

Step 9

CSS positioning lets you set how you want an element to be positioned in the browser. It has a position property you can set to static, absolute, relative, sticky or fixed.

Once you set the position property of the element, you can move the element around by setting a pixel or a percentage value for one or more of the top, right, left, or bottom properties.

static is the default positioning for all elements. If you assign it to an element, you won’t be able to move it around with top, right, left, or bottom.

Give .cat-head a position property of static, then set the top and left properties to 100px each.

question:
If an element is “static” by default, why are we setting it to static?

if an element set to “static” can not be affected by “top bottom, etc” why are we setting values for them of 100px here?

* {
  box-sizing: border-box;
}

body {
  background-color: #c9d2fc;
}

.cat-head {
position: static;
top:100px;
left: 100px;
  background: linear-gradient(#5e5e5e 85%, #45454f 100%);
  width: 205px;
  height: 180px;
  border: 1px solid #000;
  border-radius: 46%;
}

[anon86258595]

@bmc

If an element is “static” by default, why are we setting it to static?

Position: static; is apply by default on CSS with browser?

I see that many times use relative and absolute and fixed ways but not so often see that static property. By default on what elements have static? I mean if not set by browser? Or where from I can get that is need to set with position: static; ? Is a browser things? Set default like margins and paddings? Or? What the logic? Is fine but what that means in use? I mean is set by default? And if here have to set position: static; That way why? As is a default value? So that need to use or why not a…

position - CSS: Cascading Style Sheets | MDN

[bmc]

as if everyone has infinite time to read the trillion and one tutorials and man pages and how-tos. im willing to bet this article will not answer my question. the forum is supposed to be more than just a google

[JeremyLT]

This forum is about programming education. Helping you find the answers is often more important than the answer itself.

In this case, reading two links seems reasonable to me.

[bbsmooth]

@bmc

question:
If an element is “static” by default, why are we setting it to static?

if an element set to “static” can not be affected by “top bottom, etc” why are we setting values for them of 100px here?

To answer you question here, it’s being used as a teaching tactic. In the next step you will change it from static to relative and then will see the circle move.