Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> [HTML][CSS]Problem z wyśrodkowaniem strony
d0m1n1k_
post 13.11.2012, 22:24:27
Post #1





Grupa: Zarejestrowani
Postów: 208
Pomógł: 3
Dołączył: 13.07.2009
Skąd: Tarnów

Ostrzeżenie: (0%)
-----


Witam,

mam (zapewne) dziecinnie prosty problem z małym projektem.
Chcę nauczyć się CSS'a przy jednoczesnym zrobieniu projektu.
Chciałbym zrobić rodzaj vCard w ograniczonej przestrzeni (650x400px)
Chciałbym aby całość była umiejscowiona na środku (pionowo i poziomo).

Ale jakbym tego nie robił, nie działa.



Style.css
  1. .content {
  2. }
  3. .virtualcontent {
  4. width: 650px;
  5. height: 400px;
  6. position: absolute;
  7. margin-left: auto;
  8. margin-right: auto;
  9. }


Część HTML
  1. <div class="content">
  2. <div class="virtualcontent">
  3. <img src="img/temp.png" />
  4. </div>
  5. </div>


Proszę o pomoc, za którą z góry szczerze dziękuję!


--------------------
Prywatna koncepcja pasji - SprawdzAuto.info
Go to the top of the page
+Quote Post
tomi1985
post 13.11.2012, 22:31:03
Post #2





Grupa: Zarejestrowani
Postów: 192
Pomógł: 12
Dołączył: 23.09.2010
Skąd: Warszawa

Ostrzeżenie: (0%)
-----


  1. css
  2.  
  3. html, body {
  4. margin: 0px;
  5. padding: 0px;
  6. text-align: center;
  7. }
  8.  
  9. .content {
  10. margin:auto;
  11. margin-top:15%;
  12. }


i tyle smile.gif
Go to the top of the page
+Quote Post
jeremiash
post 13.11.2012, 22:33:49
Post #3





Grupa: Zarejestrowani
Postów: 94
Pomógł: 5
Dołączył: 6.11.2012

Ostrzeżenie: (0%)
-----


  1.  
  2. html,body {
  3. margin:0;
  4. padding:0;
  5. background:#ccc;
  6. }
  7.  
  8. div {
  9. margin: auto;
  10. border :0;
  11. padding:0;
  12. }
  13.  
  14. .content {
  15. width:100%;
  16. }
  17.  
  18. .virtualcontent {
  19. width: 650px;
  20. height: 400px;
  21. margin:0;
  22. background#000:;
  23. background-image:url('img/temp.png');
  24. }
  25.  


spróbuj tak...

a rysunek jako tło " background-image:url('img/temp.png');" lub tak jak wstawiłeś

Ten post edytował jeremiash 13.11.2012, 22:34:34
Go to the top of the page
+Quote Post
Damonsson
post 13.11.2012, 22:34:26
Post #4





Grupa: Zarejestrowani
Postów: 2 355
Pomógł: 533
Dołączył: 15.01.2010
Skąd: Bydgoszcz

Ostrzeżenie: (0%)
-----


nie takie "tyle" wink.gif

Zajrzyj sobie pod ten link: http://www.wpdfd.com/editorial/thebox/deadcentre4.html
Go to the top of the page
+Quote Post
tomi1985
post 13.11.2012, 22:37:59
Post #5





Grupa: Zarejestrowani
Postów: 192
Pomógł: 12
Dołączył: 23.09.2010
Skąd: Warszawa

Ostrzeżenie: (0%)
-----


uważam, że moja opcja jest mimo wszystko prostrza.... owiele mniej kodu smile.gif

ale każdy robi jak uważa
Go to the top of the page
+Quote Post
Damonsson
post 13.11.2012, 22:40:17
Post #6





Grupa: Zarejestrowani
Postów: 2 355
Pomógł: 533
Dołączył: 15.01.2010
Skąd: Bydgoszcz

Ostrzeżenie: (0%)
-----


Wyśrodkowuje w pionie powiadasz? wink.gif
Go to the top of the page
+Quote Post
tomi1985
post 13.11.2012, 22:41:33
Post #7





Grupa: Zarejestrowani
Postów: 192
Pomógł: 12
Dołączył: 23.09.2010
Skąd: Warszawa

Ostrzeżenie: (0%)
-----


w poziomie smile.gif tak jak ten kolega chcial smile.gif
Go to the top of the page
+Quote Post
jeremiash
post 13.11.2012, 22:45:16
Post #8





Grupa: Zarejestrowani
Postów: 94
Pomógł: 5
Dołączył: 6.11.2012

Ostrzeżenie: (0%)
-----


Cytat(d0m1n1k_ @ 13.11.2012, 22:24:27 ) *
Chciałbym aby całość była umiejscowiona na środku (pionowo i poziomo).


czytamy ze zrozumieniem tomi1985
biggrin.gif

Ten post edytował jeremiash 13.11.2012, 22:46:00
Go to the top of the page
+Quote Post
tomi1985
post 13.11.2012, 22:46:47
Post #9





Grupa: Zarejestrowani
Postów: 192
Pomógł: 12
Dołączył: 23.09.2010
Skąd: Warszawa

Ostrzeżenie: (0%)
-----


ups.. w takim razie przepraszam... sugerowałem sie fotką która zamieścił w poscie...
co nie zmienia faktu, że wyśrodkowanie w poziomie według moje skryptu jest niebywale proste smile.gif
Go to the top of the page
+Quote Post
Damonsson
post 13.11.2012, 23:02:43
Post #10





Grupa: Zarejestrowani
Postów: 2 355
Pomógł: 533
Dołączył: 15.01.2010
Skąd: Bydgoszcz

Ostrzeżenie: (0%)
-----


No to pomóż autorowi tematu, a nie wink.gif
Go to the top of the page
+Quote Post
d0m1n1k_
post 13.11.2012, 23:06:12
Post #11





Grupa: Zarejestrowani
Postów: 208
Pomógł: 3
Dołączył: 13.07.2009
Skąd: Tarnów

Ostrzeżenie: (0%)
-----


Już jesteśmy w połowie drogi.
Wyśrodkowanie poziome jest. Teraz przerwa na sen i rano artykuł od Jeremiash'a i mam nadzieję, że będzie super.
Jeszcze raz dzięki.
A jeśli macie jakieś proste rozwiązania pełnego problemu to walcie śmiało!


--------------------
Prywatna koncepcja pasji - SprawdzAuto.info
Go to the top of the page
+Quote Post
abort
post 13.11.2012, 23:24:06
Post #12





Grupa: Zarejestrowani
Postów: 590
Pomógł: 107
Dołączył: 25.10.2011

Ostrzeżenie: (0%)
-----


No to może jeszcze coś takiego: http://riddle.jogger.pl/2006/04/19/wszystk...trowaniu-w-css/
Stare i (chyba) nadal aktualne.

EDIT: I jeszcze z forum: http://forum.php.pl/index.php?showtopic=206438 (ostatni post, trzy linki)

Ten post edytował abort 13.11.2012, 23:25:38
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Wersja Lo-Fi Aktualny czas: 24.06.2025 - 07:53