margin: 0;
}
+.wall-item-response {
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
+
.type-link blockquote, .type-video blockquote {
margin-left: 0px;
max-height: 160px;
.imagegrid-row {
display: -ms-flexbox; /* IE10 */
display: flex;
- /* Both the following values should be the same to ensure consistent margins between images in the grid */
+ margin-top: 1em;
column-gap: 5px;
- margin-top: 5px;
}
-/* This helps allocating space for image before they loaded, preventing content shifting once they are
+.imagegrid-column {
+ -ms-flex: 50%; /* IE10 */
+ flex: 50%;
+ display: -ms-flexbox; /* IE10 */
+ display: flex;
+ flex-direction: column;
+ row-gap: 5px;
+}
+
+.imagegrid-column img {
+ -ms-flex: 50%; /* IE10 */
+ flex: 50%;
+}
+/**
+ * Image grid settings END
+ **/
+
+/* This helps allocating space for image before they are loaded, preventing content shifting once they are.
* Inspired by https://www.smashingmagazine.com/2016/08/ways-to-reduce-content-shifting-on-page-load/
* Please note: The space is effectively allocated using padding-bottom using the image ratio as a value.
- * In the image grid, this ratio isn't known in advance so no value is set in the stylesheet.
+ * This ratio is never known in advance so no value is set in the stylesheet.
*/
figure.img-allocated-height {
position: relative;
left: 0;
width: 100%;
}
+
/**
- * Image grid settings END
+ * Horizontal masonry settings START
+ **/
+.masonry-row {
+ display: -ms-flexbox; /* IE10 */
+ display: flex;
+ /* Both the following values should be the same to ensure consistent margins between images in the grid */
+ column-gap: 5px;
+ margin-top: 5px;
+}
+/**
+ * Horizontal masonry settings AND
**/
#contactblock .icon {