how do i get the <span> to be within the <div> that contains the image? the right side is too long.    .image-container {        position: relative;        display: inline-block;    }    .image-container img {display: block;}        .image-container .after {            display: block;        }        .image-container .after .content {            position: absolute;            background-color: #C0D8D8;            bottom: 0;            text-align: center;            padding: 0px;        }<div class=after>                <div class=content><a href=<?php the_permalink(); ?> title=<?php the_title_attribute(); ?>>this is some content. It can be long and span several lines.</a></div>            </div>
Why does  exceed  width?
css