Invouk 91 Odesláno: 16. Únor, 2017 Share Odesláno: 16. Únor, 2017 Zdravím: mám problém v CSS: CSS: .logo { display: block; margin: 0 auto; } toto dáva obrázok do stredu no a potrebujem aby bol obrázok za a jeden onrázok pred tým prvým, a aby bol v strede tak som skúšal toto: .logo{ position: absolute; z-index: 3500; display: block; margin: 0 auto; } Ale toto mi dá preč vycentrovanie obrázka a dá pred, pomôžete ako na to ? Link to comment Share on other sites More sharing options...
0 Fakerko_ 190 Odesláno: 16. Únor, 2017 Share Odesláno: 16. Únor, 2017 <div class="image-wrapper"> <div class="sq1"></div> <div class="sq2"></div> </div> .image-wrapper{ position: relative; width: 200px; height: 200px; } .sq1{ position: absolute; z-index: 1; width: 100%; height: 100%; background: #333; } .sq2{ position: absolute; z-index: 2; width: 100%; height: 100%; background: #999; } Link to comment Share on other sites More sharing options...
0 Invouk 91 Odesláno: 16. Únor, 2017 Author Share Odesláno: 16. Únor, 2017 ktorý je teraz ten vycentrovaný sq1 alebo sq2 ? Link to comment Share on other sites More sharing options...
0 Fakerko_ 190 Odesláno: 16. Únor, 2017 Share Odesláno: 16. Únor, 2017 Vycentruješ celý wrapper Link to comment Share on other sites More sharing options...
0 Invouk 91 Odesláno: 17. Únor, 2017 Author Share Odesláno: 17. Únor, 2017 (upraveno) CSS .image-wrapper{ width: 100%; position: relative; margin: 0 auto; } .lg{ position: absolute; z-index: 200; } .bg-lg{ position: absolute; z-index: 100; height: 500px; } HTML: <div class="image-wrapper"> <div class="lg"><img src="./img/Batman_Logo.jpeg" alt="Logo" style="width: 30%; height: 20%;"></img></div> <div class="bg-lg"> <img src="./img/bg.png" alt="bg-logo"></img></div> </div> a robí mi to, hocijako ani neroztiahne ten bg do maxima, a ani nevycentruje, a dá to pred text... čož nechcem. Edited 17. Únor, 2017 by eXpresS Link to comment Share on other sites More sharing options...
0 Huzy 11 Odesláno: 18. Únor, 2017 Share Odesláno: 18. Únor, 2017 Trochu nechápu, co chceš. Můžeš mi to nakreslit? Hodím ti sem pak kompletní css. Link to comment Share on other sites More sharing options...
0 Invouk 91 Odesláno: 19. Únor, 2017 Author Share Odesláno: 19. Únor, 2017 Tento obrázok čo je v krúžku (batman logo) potrebujem vycentrovať. Link to comment Share on other sites More sharing options...
0 Huzy 11 Odesláno: 19. Únor, 2017 Share Odesláno: 19. Únor, 2017 (upraveno) http://codepen.io/Huzy666/pen/oBrxEm Tady to máš Nahraď obrázky za background-color a je to A uprav si velikosti. Jo, u wrapperu nastav bg-color: transparent; nebo smaž bg-color Edited 19. Únor, 2017 by Huzy Link to comment Share on other sites More sharing options...
0 Fakerko_ 190 Odesláno: 19. Únor, 2017 Share Odesláno: 19. Únor, 2017 http://codepen.io/Huzy666/pen/oBrxEm Tady to máš Nahraď obrázky za background-color a je to A uprav si velikosti. Pokud někdo půjde přes mobil, tak tam bude zbytečně velká mezera mezi horní hranou a obrázkem. Místo translate bych udělal display: table; a display: table-cell; Link to comment Share on other sites More sharing options...
0 Huzy 11 Odesláno: 19. Únor, 2017 Share Odesláno: 19. Únor, 2017 Pokud někdo půjde přes mobil, tak tam bude zbytečně velká mezera mezi horní hranou a obrázkem. Místo translate bych udělal display: table; a display: table-cell; To slyším po prvně, abych se přiznal Někdy to vyzkouším. Link to comment Share on other sites More sharing options...
0 Fakerko_ 190 Odesláno: 19. Únor, 2017 Share Odesláno: 19. Únor, 2017 To slyším po prvně, abych se přiznal Někdy to vyzkouším. Když to zobrazíš jako tabulku, tak můžeš použít vertical-align: middle; Link to comment Share on other sites More sharing options...
0 Invouk 91 Odesláno: 19. Únor, 2017 Author Share Odesláno: 19. Únor, 2017 (upraveno) Pridal som tam obrázok aby pulzoval: .pulse { animation: pulse 7s infinite; display: table; margin-top: 50px; animation-direction: alternate; -webkit-animation-name: pulse; animation-name: pulse; } @-webkit-keyframes pulse { 0% { -webkit-transform: scale(1); } 50% { -webkit-transform: scale(1.1); } 100% { -webkit-transform: scale(1); } } @keyframes pulse { 0% { transform: scale(1); } 50% { transform: scale(1.1); } 100% { transform: scale(1); } } Zistil som, že toto mi dáva na stranu ten obrázok. Vycentrované bez pulse som to mal.Ale ako tam dám toto tak to posune tak o 20% do pravej strany. Edited 21. Únor, 2017 by eXpresS Link to comment Share on other sites More sharing options...
Dotaz
Invouk 91
Zdravím: mám problém v CSS:
CSS:
toto dáva obrázok do stredu no a potrebujem aby bol obrázok za a jeden onrázok pred tým prvým, a aby bol v strede tak som skúšal toto:
Ale toto mi dá preč vycentrovanie obrázka a dá pred, pomôžete ako na to ?
Link to comment
Share on other sites
11 odpovědí na tuto otázku
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now