Change height makes problems

Question

I implemented spectrum color picker. I'm trying to change the alpha sliders height. (The one with the class name: .sp-alpha.)
When I do that, then the color picker containers (class name: sp-top-inner) height changes.

How can I edit the source file so that I can change the alpha sliders height without affecting other elements?

It will be difficult to go everywhere around to look the documentation for you. Why don't you post the relevant code here so we can directly see what would be possible to do? — Franco, Dec 14 '15 at 19:17
For every pixel you increase the `.sp-alpha` you need to increase the `bottom` of the `.sp-top-inner`. — Gabriele Petrioli, Mar 31 '17 at 20:58

SEAN · Answer 1 · 2017-03-31T21:11:06.300

0

Set .sp-top-inner height to 150px or add bottom:20px (any number you like):

.sp-top-inner {
    height: 150px;
}

Or

.sp-top-inner {
        bottom: 20px;
    }

then change the height of .sp-alpha and add custom margin:

 .sp-alpha-enabled .sp-alpha {
  height: 20px;
  margin: 5px 5px 5px 0;
}

Note: Just add above codes if you want to enable alpha mode.

JSFiddle Demo

edited Mar 31 '17 at 21:11

answered Mar 31 '17 at 20:47

SEAN

51
5

Change height makes problems

1 Answers1