If you want to make a square in css, you can do the following.

The HTML:

<div class="square">
  <div class="innerContainer">
  </div>
</div>

The CSS:

.square{
  width:75%;
  padding-bottom:75%;
  position: relative;
}
.innerContainer{
  position: absolute;
}

The width and padding-bottom must be equal and provide the square and do not have to be in % it can be in pixels or whatever, but the padding-bottom makes for height equal to width.

The absolute position on innerContainer is what makes it so you can add text or stuff inside the square without making the square taller or bigger.