Blogerzy wszystkich platform, łączcie się!

Dyskusje Blogerów, Fotoblogerów i Vlogerów - fora blogowe, graficzne, ogólnotematyczne
rozmowy o blogach, porady, instrukcje, ciekawostki z internetu



::
Autor Wiadomość
wendigo 
Myspot.Klub


Pomógł: 4 razy
Dołączył: 18 Lis 2012
Posty: 307

Wysłany:    Jak wyśrodkować takiś szablon?

Weźmy dla przykładu taki szablon: http://siostry_nafuto.w.i...ilight_kod.html - czy da się tak zrobić (inaczej niż na tabeli) żeby divy razem z grafiką były wyśrodkowane? Bo szukam, szukam rozwiązania i nie umiem :P a jedyne co znajduję, to jak wyśrodkować dwa divy obok siebie kiedy są tej samej wielkości... no a tu nie są i są w dodatku w odstępie.
Wiem, że tabelę zawsze można wyśrodkować... no ale czy to jedyna opcja na taki układ szablonu?
 
  podziel się tym postem na:




Utwórz darmowe konto na forum --- Zaloguj się --- Polub Blogowicza na FB!
Dołącz do społeczności na G+ --- Dołącz do grupy Bloggerów na FB

Htsz 
Blogger Product Expert
Blogowicz.Team


Zaproszone osoby: 83
Imię: Arkadiusz (Arek)
Pomógł: 806 razy
Wiek: 33
Dołączył: 01 Sty 2006
Posty: 8853
Miasto: Wrocław

Wysłany: 2016-04-24, 19:12   

Poszukaj sobie raczej czegoś elastycznego, nowocześniejszego. Ten szablon jest zrobiony bardzo starą metodą - elementy pozycjonowane są absolutnie - tj. ustalana jest pozycja od krawędzi okna przeglądarki. Dodatkowo interia dokleiła tam swoje śmieci i trzeba je najpierw posprzątać.

Potem przenosisz kod obrazka City_of_Twilight_szab.JPG do body i wraz z pozostałymi divami, w których jest lewa i prawa kolumna zamykasz w kolejnym DIV, np.

Kod

<div id="ramy-bloga">
<kod img>
<div>ten z kolumną postów</div>
<div>ten z menu</div>
</div>

Do CSS dopisujesz:

Kod


body {
background-position: top center;
}
#ramy-bloga {
width: 665px;
margin: 0 auto;
position: relative;
}
______________________________________________________
nie radzisz sobie? :arrow: pomoc indywidualna oraz blogi i strony na zamówienie
zapraszam do przewodnika po forum oraz grupy Blogger Polska! na fb

Think before you post™ | ^_^ na każdego posta znajdzie się riposta™

Jeżeli nasze posty pomogły rozwiązać Twoje problemy możesz odwdzięczyć się, udostępniając link do tego forum na swoim blogu, fanpejdżu lub stronie!
Nie zapomnij kliknąć
lubię to! na facebooku lub dodać do obserwowanych na google+. :^^:
 
  podziel się tym postem na:
wendigo 
Myspot.Klub


Pomógł: 4 razy
Dołączył: 18 Lis 2012
Posty: 307

Wysłany: 2016-05-01, 22:46   

O super, udało mi się prawie idealnie :) A jakoś sam nie umiałem na to wpaść :D

Tak, ja wiem, że on jest przestarzały, kiepski i zaśmiecony ;) ale wybrałem ten, bo to był idealny przykład (który jeszcze uchował się online) żeby wytłumaczyć o co mi chodzi :)

Tak mi wyszło: https://dl.dropboxusercon...ysrodkowac.html (już trochę posprzątałem ;) ), więc prawie całkiem dobrze, tylko jeszcze co zrobić żeby nad obrazkiem nie było widać tła? (czyli chyba jak podnieść trochę obrazek?)

tu obecny kod dla ułatwienia (trochę posprzątany ;) ):

Kod

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2">
<title>...</title>
<style type="text/css">
a {color: #696969;}
a:hover {color: #6666cc;}
td, p, b, div {font-family: Verdana; color:#ffffff; font-size: 12px}
body {
background: url('http://siostry_nafuto.w.interia.pl/City_of_Twilight_linie.JPG') repeat-y #000000 top center;
}
#ramy-bloga {
width: 665px;
margin: 0 auto;
position: relative;
}
</style>
</head>
<body>
<div id="ramy-bloga">
<img src="http://siostry_nafuto.w.interia.pl/City_of_Twilight_szab.JPG" alt="" />
<div style="position: relative; top: -65px; left: 65px; width: 330px; text-align: center;"> {blog}<br /><br />
---------------------------------------------<br />
Lay by Alien <br>
From <a href="http://szablony33.w.interia.pl"> Szablony 33</a>
</div>
<div style="position: relative; top: -410px; left: 469px; width: 157px; text-align: center;">
<b>Księga Gości</b><br />
<a href="http://{ksywa}.blog.pl/xiega/index.php">Zobacz</a><br />
<a href="http://{ksywa}.blog.pl/xiega/dodaj.php">Wpisz się</a><br /><br />
<b>Archiwum</b><br />
{archiwum}<br /><br />
<b>Linki</b><br />
{linki}<br /><br />
</div>
</div>
</body>
</html>
 
  podziel się tym postem na:
Htsz 
Blogger Product Expert
Blogowicz.Team


Zaproszone osoby: 83
Imię: Arkadiusz (Arek)
Pomógł: 806 razy
Wiek: 33
Dołączył: 01 Sty 2006
Posty: 8853
Miasto: Wrocław

Wysłany: 2016-05-02, 09:28   

do stylu body dopisz

Kod

margin: 0;
większość takich problemów da się rozwiązać przy pomocy narzędzia "zbadaj element" pod prawym klawiszem myszy.
______________________________________________________
nie radzisz sobie? :arrow: pomoc indywidualna oraz blogi i strony na zamówienie
zapraszam do przewodnika po forum oraz grupy Blogger Polska! na fb

Think before you post™ | ^_^ na każdego posta znajdzie się riposta™

Jeżeli nasze posty pomogły rozwiązać Twoje problemy możesz odwdzięczyć się, udostępniając link do tego forum na swoim blogu, fanpejdżu lub stronie!
Nie zapomnij kliknąć
lubię to! na facebooku lub dodać do obserwowanych na google+. :^^:
 
  podziel się tym postem na:
wendigo 
Myspot.Klub


Pomógł: 4 razy
Dołączył: 18 Lis 2012
Posty: 307

Wysłany: 2016-05-05, 00:16   

Dzięki wielkie :)
 
  podziel się tym postem na:
Wyświetl posty z ostatnich:   
::
Odpowiedz do tematu
Nie możesz pisać nowych tematów. Zobacz szczegóły.
Nie możesz odpowiadać w tematach. Zobacz szczegóły.
Nie możesz zmieniać swoich postów
Nie możesz usuwać swoich postów
Nie możesz głosować w ankietach
Nie możesz załączać plików na tym forum
Nie możesz ściągać załączników na tym forum
Dodaj temat do Ulubionych
Wersja do druku

Skocz do:  

Powered by phpBB & Weblove.pl © 2006-2018 Wrocław | modified by Przemo © 2003 phpBB Group.
skocz na górę   |  shoutbox
 
Dodaj na Facebooku:
Dodaj na Google+:


Zobacz także:


Szablony wordpress
kod zniżkowy -10% za licencję
w koszyku wpisz: Blogowicz
Wyszukaj na Blogowiczu:
snapchat blogowicz instagram blogowicz