loader image alignment both dev server and mobile view placed as cente

Question

In dev server the loaderalignment is center comming into mobile view alignments has been changed then how i can get both alignment as center could you please send me the code?

Naimish Makwana · Answer

Hello Latha, You can use below CSS to show loader in centre screen. .loader-container { position: fixed; top: 0; left: 0; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; background-color: rgba(0, 0, 0, 0.5); z-index: 9999; } .loader { border: 8px solid #f3f3f3; border-top: 8px solid #3498db; border-radius: 50%; width: 50px; height: 50px; animation: spin 1s linear infinite; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } Then use is like below: Thanks Naimish Makwana

Deepak Rawat · Answer

.loader { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); /* other styles for the loader */ } the loader should be centered in both desktop and mobile views. You can adjust other CSS styles as per your requirements.

Latha Donepudi · Answer

this is my code for loader give me any suggestions

Latha Donepudi · Answer

while taking this code got loder center in mobile view, but desktop view changed

loader image alignment both dev server and mobile view placed as cente

Answers (4)