Forum Blogowe 17 lat!

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
FAQFAQ    UżytkownicyUżytkownicy  grupa Blogger Polska! na FBBlogger Polska!  GrupyGrupy  regulaminRegulamin RejestracjaRejestracja  ZalogujZaloguj

»  »  »  ::
Autor Wiadomość
wendigo 


Pomógł: 4 razy
Dołączył/a: 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 grupy Bloggerów na FB

Htsz 
Blogger Product Expert
Blogowicz.Team


Zaproszone osoby: 84
Imię: Arkadiusz Narowski
Pomógł: 816 razy
Wiek: 39
Dołączył/a: 01 Sty 2006
Posty: 8949
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. :^^:
 
  podziel si� tym postem na:
wendigo 


Pomógł: 4 razy
Dołączył/a: 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: 84
Imię: Arkadiusz Narowski
Pomógł: 816 razy
Wiek: 39
Dołączył/a: 01 Sty 2006
Posty: 8949
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. :^^:
 
  podziel si� tym postem na:
wendigo 


Pomógł: 4 razy
Dołączył/a: 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-2024 Wrocław | modified by Przemo © 2003 phpBB Group.
↑ skocz na górę ↑   |  shoutbox
 
Dodaj na Facebooku:

Zobacz także:


Szablony blogów i stron na wordpress
ogromna baza motywów WP, podzielona na kategorie tematyczne. Proste, jednostronicowe wizytówki lub zaawansowane układy, także z funkcją sklepu internetowego (ecommerce).
Wyszukaj na Blogowiczu:
snapchat blogowicz instagram blogowicz