Wyśrodkowanie obrazka w pionie i poziomie w bloku DIV

Wszystko o HTML, XHTML, XML, CSS.
juli126
Posty: 12
Rejestracja: 24 cze 2011, 12:08:26
Reputacja: 0
Płeć: Niewybrana
User Agent: Firefox Windows 1366x768

Wyśrodkowanie obrazka w pionie i poziomie w bloku DIV

Postautor: juli126 » 04 lip 2011, 13:01:16

Witam,
wie ktoś jak wyśrodkować obrazek w pionie i poziomie, który się znajduje w divie ??
Mam obrazki umieszczone w divach i chce je wyśrodkować w pionie i poziomie.
LaY
Posty: 1120
Rejestracja: 28 sty 2009, 15:20:07
Reputacja: 33
Lokalizacja: Silesia
Płeć: Mężczyzna
User Agent: Opera Windows 1920x1080
Kontakt:

Re: Wyśrodkowanie obrazka w pionie i poziomie w bloku DIV

Postautor: LaY » 04 lip 2011, 20:48:33

- margin:auto dla obrazka, może pomóc ale nie musi
- vertical-align:middle dla obrazka na wyśrodkowanie w pionie(ale to chyba dla obrazków nie zadziała)
- text-align:center dla div'aw celu wyśrodkowania zawartości w poziomie, zadziała na bank

---- EDIT ----

Możesz też pozycjonować div'a relatywnie a obrazek absolutnie

CodeColon Select All Code


img
{
position:absolute;
top:50%;
left:50%;
margin-top: -1/2H;
margin-left: -1/2W;
}
 

ten kod akurat jest z jednego z for, na te marginesy sam bym nie wpadł :P
Niě nerwuj hanysa
juli126
Posty: 12
Rejestracja: 24 cze 2011, 12:08:26
Reputacja: 0
Płeć: Niewybrana
User Agent: Firefox Windows 1366x768

Re: Wyśrodkowanie obrazka w pionie i poziomie w bloku DIV

Postautor: juli126 » 05 lip 2011, 01:40:36

dzięki za pomoc, ale poradziłem sobie z tym na tabelkach :)
pitrus1991
Posty: 1
Rejestracja: 24 paź 2015, 19:59:59
Reputacja: 0
Płeć: Niewybrana
User Agent: Firefox Windows 1680x1050

Wyśrodkowanie obrazka w pionie i poziomie w bloku DIV

Postautor: pitrus1991 » 02 cze 2016, 14:04:23

Można to zrobić w prostszy sposób, temat z 2011 roku, ale myślę, że pomogę innym. Zapewne większość w czytuje obrazki za pomocą znacznika <img src="sciezka">, istnieje inny sposób który zaoszczędzi niepotrzebnych nerwów. Najlepiej na stronie dodać tylko

CodeColon Select All Code

 <div class="nazwa_klasy"> </div>


A w CSS

CodeColon Select All Code

.nazwa_klasy
{
   width: 500px;
   height: 500px;
   background: url('sciezka_do_obrazka') no-repeat;
   background-position: center;
   background-size: 200px auto; // opcjonalnie (pierwsza wartość to wysokość, druga to szerokość)
}
katia77
Posty: 3
Rejestracja: 08 lis 2016, 09:04:07
Reputacja: 0
Płeć: Niewybrana
User Agent: Chrome Windows 1680x1050

Wyśrodkowanie obrazka w pionie i poziomie w bloku DIV

Postautor: katia77 » 08 lis 2016, 09:04:49

:mrgreen:

Wróć do „HTML, CSS”

Kto jest online

Użytkownicy przeglądający to forum: Obecnie na forum nie ma żadnego zarejestrowanego użytkownika i 5 gości