Salve
Ho risolto l'altro problema però ora ne ho un altro.
Nel pc è tutto ok ma quando vedo quello che ho fatto in un cellulare la barra che ho appena creato viene tutta lunga e decentrata e anche l'immagine batte tutta a sinistra.
Dovrei almeno centrare il tutto. Come posso fare? Per l'immagine ho usato il css bootstrap per lo span invece un css interno alla pagina.
Questo è il css interno alla pagina:

codice HTML:
.caption {    font-family: Garamond, Verdana, sans-serif;    font-size: 13px;    float: center;    margin: 0;    padding: 0;    position: relative;    overflow: hidden;} .caption img {    float: center;    margin: 0;    padding: 10;    background: #fff;    border: none;} .caption span {    float: center;    margin: 20;    padding: 10px;    width: 84%;    color: #dedede;    margin-left: 15px;     background: #222; /* browser che non supportano rgba */    background: rgba(0,0,0,0.4);    position: absolute;    left: 0;    bottom: 0;} .caption span strong {    font-weight: bold;    font-size: 13px;    text-transform: uppercase;    display: block;    padding-bottom: 0px;}
Questo è il richiamo sotto:

codice HTML:
<div class="col-lg-2 portfolio-item caption">                <a href="#">                    <img class="img-thumbnail" src="webcam/fitslimshyfamous.jpg" alt="Luxury Ready Goods in Season" style="border: 1px solid #531B00; padding: 1" width="200" height="180"> </a>            <span><strong><center><a href="#"><font color="#FFFFFF">Fitslimshyfamous</font></a></center></strong></span>            </div>