#plugin__upgrade { margin: 0 auto; height: 20em; overflow: auto; } #plugin__upgrade_form { display: block; margin: 0 auto 3em auto; width: 20em; } #plugin__upgrade_form input.continue { float: right; } #plugin__upgrade_form input.abort { float: left; } /* based on http://cssdeck.com/labs/progress-bar */ #plugin__upgrade_meter { height: 20px; position: relative; margin: 1em; } #plugin__upgrade_meter ol { margin: 0; padding: 0; display: block; height: 100%; width: 99%; border-radius: 10px; background-color: #ddd; position: relative; list-style: none; } #plugin__upgrade_meter ol li { float: left; margin: 0; padding: 0; text-align: right; width: 19%; position: relative; border-radius: 10px; } #plugin__upgrade_meter ol li span{ right:-0.5em; display: block; text-align: center; } #plugin__upgrade_meter ol li .step { top: -0.4em; padding: .2em 0; border: 3px solid #ddd; z-index: 99; font-size: 1.25em; color: #ddd; width: 1.5em; font-weight: 700; position: absolute; background-color: #fff; border-radius: 50%; } #plugin__upgrade_meter ol li .stage { color: #fff; font-weight: 700; } #plugin__upgrade_meter ol li.active { height: 20px; background: #aaa; } #plugin__upgrade_meter ol li.active span.stage { color: #000; } #plugin__upgrade_meter ol li.active span.step{ color: #000; border: 3px solid __link__; }