Ajax-loader-large-white
Sun, Earth, and Code
Sun and Earth Styles

Before we dive into creating planet orbits, lets add some fun styling to the sun and earth.

Here are some options.

In your style.css, copy either or both of the following styles into your #sun class:


  border-color: orange;
  border-width: 2px;
  border-style: solid;
  border-radius: 50%;

and/or

box-shadow: 0 0 64px yellow;

See what happens.

Instructions

Play with your #sun style.

This is what mine looks like:

#sun {
    position: absolute;
    top: 50%;
    left: 50%;

    height: 200px;
    width: 200px;
    margin-top: -100px; 
    margin-left: -100px;

    border-color: orange;
    border-width: 8px;
    border-style: solid;
    border-radius: 50%;

    box-shadow: 0 0 128px red;
}

Try styling your Earth as well.

index.html
style.css
project
View Preview