CODEWITHSUNDEEP
htmlcsstwitter-bootstrapanchor
user31782
user31782

Reputation: 7589

Why does position absolute give anchor tag 100% height of it's container?

I have been studying bootstrap carousel from http://getbootstrap.com/javascript/#carousel

The left and right side angle bracket controls having classes carousel-control are anchor tags. These anchor tags have 100% height of their container. These are also absolutely positioned with respect the container div. My question is:

Upvotes: 0

Views: 413

Answers (1)

Paulie_D
Paulie_D

Reputation: 115174

Position absolute blockifies elements but it won't make them 100% height of the parent unless explicity stated.

In this case it's stated in the CSS

.carousel-control {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 15%;
    font-size: 20px;
    color: #fff;
    text-align: center;
    text-shadow: 0 1px 2px rgba(0,0,0,.6);
    background-color: rgba(0,0,0,0);
    filter: alpha(opacity=50);
    opacity: .5;
}

Basically

top: 0;
bottom: 0;

Is essentially that same as height:100%.

Upvotes: 1

Related Questions