FIX silverstripe#64: TinyMCE text and image alignment issue

zzdjk6 · Feb 5, 2019 · 2ba821e · 2ba821e
1 parent 319197a
commit 2ba821e
Showing 1 changed file with 25 additions and 11 deletions.
diff --git a/css/typography.css b/css/typography.css
@@ -144,13 +144,13 @@ body {
 
 /* WYSIWYG EDITOR ALIGNMENT CLASSES
 -------------------------------------------- */
-.typography .text-left {
+.typography .text-left, .typography .left {
     text-align: left
 }
-.typography .text-center {
+.typography .text-center, .typography .center {
     text-align: center
 }
-.typography .text-right {
+.typography .text-right, .typography .right {
     text-align: right
 }
 
@@ -178,6 +178,12 @@ body {
     margin-bottom: 10px;
     clear: both;
 }
+.typography img.rightAlone {
+    float: right;
+    margin-left: 100%;
+    margin-bottom: 10px;
+    clear: both;
+}
 .typography img.center {
     float: none;
     margin-left: auto;
@@ -212,14 +218,16 @@ body {
   .typography .captionImage.right img {
     margin-left: -10px;
   }
-  .typography .captionImage.right p {
-    margin-left: -10px;
-    text-align: left;
-    margin-left: -10px;
-  }
-.typography .captionImage.leftAlone{
-  float:none;
-  margin: 0 20px 20px 0px;
+
+.typography .captionImage.leftAlone {
+    float: left;
+    clear: both;
+    margin-right: 100%;
+}
+.typography .captionImage.rightAlone {
+    float: right;
+    clear: both;
+    margin-left: 100%;
 }
 .typography .captionImage.center{
   margin: 0 auto 20px;
@@ -230,6 +238,12 @@ body {
   font-style: italic;
   color: #888;
 }
+.typography .captionImage p.caption.text-center {
+    text-align: center;
+}
+.typography .captionImage p.caption.text-left {
+    text-align: left;
+}
 
 
 /* BLOCKQUOTES