Fix for ie8 styles for preview switch and modes

silverstripe · Dec 17, 2012 · 51c6a87 · 51c6a87
1 parent 8779e9b
commit 51c6a87
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 10 deletions.
diff --git a/admin/css/ie7.css b/admin/css/ie7.css
@@ -42,12 +42,13 @@
 .filter-buttons button.ss-gridfield-button-filter { background-position: -18px 4px !important; }
 
 /* Alternative styles for the switch in old IE */
-fieldset.switch-states { padding: 0; }
-fieldset.switch-states .switch { padding: 0 10px 0 0; }
+fieldset.switch-states { padding-right: 5px; }
+fieldset.switch-states .switch { padding: 0; width: 132%; left: -32px; }
 fieldset.switch-states .switch label { overflow: visible; text-overflow: visible; white-space: normal; padding: 0; }
 fieldset.switch-states .switch label.active { color: #fff; background-color: #2b9c32; }
-fieldset.switch-states .switch label span { display: inline; padding: 0 10px; padding-right: 15px; overflow: visible; text-overflow: visible; white-space: wrap; }
+fieldset.switch-states .switch label span { display: inline; padding: 0 8px; overflow: visible; text-overflow: visible; white-space: wrap; }
 fieldset.switch-states .switch .slide-button { display: none; }
+fieldset.switch-states .switch input.state-name { margin-left: -20px; }
 
 /* Hide size controls in IE - they won't work as intended */
 .cms-content-controls .preview-size-selector { display: none; }

diff --git a/admin/css/ie8.css b/admin/css/ie8.css
@@ -42,12 +42,13 @@
 .filter-buttons button.ss-gridfield-button-filter { background-position: -18px 4px !important; }
 
 /* Alternative styles for the switch in old IE */
-fieldset.switch-states { padding: 0; }
-fieldset.switch-states .switch { padding: 0 10px 0 0; }
+fieldset.switch-states { padding-right: 5px; }
+fieldset.switch-states .switch { padding: 0; width: 132%; left: -32px; }
 fieldset.switch-states .switch label { overflow: visible; text-overflow: visible; white-space: normal; padding: 0; }
 fieldset.switch-states .switch label.active { color: #fff; background-color: #2b9c32; }
-fieldset.switch-states .switch label span { display: inline; padding: 0 10px; padding-right: 15px; overflow: visible; text-overflow: visible; white-space: wrap; }
+fieldset.switch-states .switch label span { display: inline; padding: 0 8px; overflow: visible; text-overflow: visible; white-space: wrap; }
 fieldset.switch-states .switch .slide-button { display: none; }
+fieldset.switch-states .switch input.state-name { margin-left: -20px; }
 
 /* Hide size controls in IE - they won't work as intended */
 .cms-content-controls .preview-size-selector { display: none; }

diff --git a/admin/scss/_ieShared.scss b/admin/scss/_ieShared.scss
@@ -142,9 +142,11 @@
 
 /* Alternative styles for the switch in old IE */
 fieldset.switch-states{
-	padding:0;
+	padding-right: 5px;
 	.switch{
-		padding:0 10px 0 0;
+		padding: 0;
+		width: 100%+32;
+		left: -32px;
 		label{
 			overflow:visible;
 			text-overflow:visible;
@@ -156,8 +158,7 @@ fieldset.switch-states{
 			}
 			span{
 				display:inline;
-				padding:0 10px;
-				padding-right:15px;
+				padding:0 8px;
 				overflow:visible;
 				text-overflow:visible;
 				white-space:wrap;
@@ -166,6 +167,9 @@ fieldset.switch-states{
 		.slide-button{
 			display:none;
 		}
+		input.state-name {
+			margin-left: -20px;
+		}
 	}
 }
 /* Hide size controls in IE - they won't work as intended */