I'm having the codes below to have a border around the thumb photo and its caption (if needed)
.mw-parser-output .tleft, .tright {
padding: 3px 3px 3px 4px;
border: 2px solid #7A21FF;
border-radius: 6px;
}
.mw-content-ltr .thumbcaption {
margin-top: 5px;
border-top: 1px solid #B787FF;
padding-top: 5px;
padding-left: 3px;
text-align: center;
color: inherit;
}
.lazyloaded {
border-radius: 4px;
}
It's fine in general, but the inner border (lazyloaded class) will also affect the thumb photo on galleries - something I do not wish for. Is there a way to prevent that?
Also, is there any difference between .lazyload and .thumbimage? And final, I only wish for the long line between thumb photo & caption only shows up when caption is available, is that possible?