Showing bar for custom width fails about react-redux-loading-bar

[iphonic]

Update

I have added position css to both parent and child which seems to fix the problem but partially, see me code below

const Loader = () => {
  return (
    <header style={{height:'3px',marginTop:'13px',marginLeft:'60px',position:'relative'}}>
      <LoadingBar style={{ backgroundColor: '#4da1ff', height: '3px',position:'absolute', zIndex:9999, width:'100%'}} showFastActions updateTime={500} />
    </header>
  );
};

But it created another problem the progress bar doesn't complete 100%, see below how it looks

I have found that the progress bar doesn't go up to transform to 1, see the element inspection below,

Thanks.

[iphonic]

I fixed the issue by supplying maxProgress={100} as property, found that the default maxProgress value was set to 99, so the progress wasn't completing 1.

[mironov]

@iphonic Glad it worked out for you. The default maxProgress is set to 99% to show that the long-running action is still in progress. Once action is completed, the loading bar will come to 100% and disappear.

[iphonic]

@mironov Should I consider that showLoading() only executes upto 99% while hideLoading() finishes the last 1%?

[mironov]

@iphonic yes, exactly