I’m posting images of logos on a page and I can’t get to images to be next to each other without looking distorted. I’ve tried class="left"/"right" but the images don’t line up neatly. I want to avoid a long line of images right under each other. My goal is to have images line up like two columns next to each other.
FYI: I’m very new to Modx, learning as I go, any suggestions would be great. Thanks.
img.centered {
display: block;
margin-left: auto;
margin-right: auto;
}
img.alignright {
padding: 4px;
margin: 0 0 2px 7px;
display: inline;
}
img.alignleft {
padding: 4px;
margin: 0 7px 2px 0;
display: inline;
}
.alignright {
float: right;
}
.alignleft {
float: left
}
.caption {
border: 1px solid #ddd;
text-align: center;
background-color: #f3f3f3;
padding-top: 4px;
margin: 10px;
/* optional rounded corners for browsers that support it */
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}
.caption img {
margin: 0;
padding: 0;
border: 0 none;
}
.caption p.caption-text {
font-size: 11px;
line-height: 17px;
padding: 0 4px 5px;
margin: 0;
}
