Ocena wątku:
  • 0 głosów - średnia: 0
  • 1
  • 2
  • 3
  • 4
  • 5
[CSS] Problem z wysrodkowaniem obrazka
#1
Witam!

Moja stronka wygląda tak

Kod:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
<head>

<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
<meta name="Autor" content="Zbigniew Wawrzyniak" />

<title>stronka</title>

<link rel="stylesheet" href="style_stronka.css" type="text/css" />


</head>
<body>
<div class="lista_fotografii">
<img src="images/foto_1fake.jpg"/>
</div>

</body>
</html>

CSS
Kod:
html {
width: 100%;
height: 100%;
padding: 0px;
margin: 0px;
}

body {
margin : 0px;
padding:0px;
border:0px;
}

img{
display: block;
margin-left: auto;
margin-right: auto;
}

Nie wiem jak zrobić żeby obrazek(szeroki na 1920px) był zawsze wyśrodkowany (używając selektora <img> - nie wiem czy jest to możliwe) - za pomocą cechy background niema problemu wystarczy w stylach wpisać center i zawsze środek zdjęcia jest po środku niezależnie od szerokości przeglądarki. W przypadku selektora <img> obraz "trzyma się" lewej krawędzi przeglądarki - jak zmniejszamy przeglądarkę (zbliżamy lewą krawędź przeglądarki w strone prawej) widzimy zawsze lewą część obrazka przy lewej krawędzi przeglądarki.

z góry dzięki za odpowiedz,
Odpowiedz
#2
Jak tak nie działa (a powinno) spróbuj znacznikami HTML <center></center>
Odpowiedz
#3
Tak, i jeszcze powinien założyć sweter w paski oraz okulary z denkiem, żeby lepiej wczuć się w klimat lat 90-tych Smile No i odpowiedni podkład muzyczny: http://www.youtube.com/watch?v=RLtU7aOnp2U

Jaką funkcję ma pełnić to zdjęcie ? Można pozycjonować absolutnie. Ustawiasz np. top i left na 50%, a następnie dajesz ujemne marginesy równe połowie danego wymiaru.
[/quote]
Kod:
img{
     position: absolute;
     top: 50%;
     margin-top: -(połowa wysokości zdjęcia);
     left: 50%;
     margin-left: -(połowa szerokości zdjęcia);
}

Jeżeli chcesz dodatkowo, aby zdjęcie nie podlegało efektowi scrollowania, to zamiast absolute użyj fixed.
Odpowiedz
#4
Element img domyślnie jest typu display:inline-block (powiedzmy). Dlatego żeby go wycentrować trzeba dać NADRZĘDNEMU elementowi text-align:center
jeżeli chcesz centrować także pionowo, zastosuj trik z :after

Poniżej w rozdziale centrowanie popupa macie opisane 3 metody. Ja bym wybrał metodę nr 3.

http://doman.art.pl/webmaster/popupy/
Odpowiedz


Podobne wątki…
Wątek: Autor Odpowiedzi: Wyświetleń: Ostatni post
  [HTML] Filmik zamiast obrazka wyróżniającego kuklaale 1 2,759 02-11-2016, 18:36
Ostatni post: martt4dg
  [CSS][HTML] Ustawienie obrazka z boku strony Witek7777 8 8,476 22-09-2016, 01:05
Ostatni post: pocahontas
Question Jak spowodować wysunięcie na wierzch obrazka? Shibu 4 4,091 13-05-2013, 18:12
Ostatni post: hieroshima
  Superfish menu - problem z wyśrodkowaniem. Gargamel 3 3,624 13-02-2013, 19:02
Ostatni post: Kartofelek
  Html/Css dodawanie obrazka na teksture w tle aga_k 9 7,027 21-12-2012, 04:12
Ostatni post: Kartofelek

Skocz do:


Użytkownicy przeglądający ten wątek:
Sponsorzy i przyjaciele
SeoHost.pl