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ść
Getright 
Blogger.Klub


Wiek: 29
Dołączył/a: 14 Sie 2012
Posty: 29
Wysłany:    [blogger] Jak wyśrodkować gadżet iframe oraz embed?
Witam. To znowu ja :( Nie wiem czy dobrze zatytułowałem temat.
Mam nietypowy problem, na moim blogu chciałbym wyśrodkować (o ile to możliwe) te elementy. Obecnie po kliknieciu "Watch WWE Royal Rumble 2013" widać, że stream jest od początku bloga, zatem czat wychodzi poza teren. Chciałbym te oba elementy wyśrodkować. Czy to wogóle możliwe?

Jeśli ktoś nie do końca rozumie o co mi chodzi link do bloga znajduje się w profilu.

Poniżej kod którego użyłem do stworzenia do tego połączenia.

Kod

<table border="0"><tbody></tbody><tbody><tr><th>

<iframe style="HEIGHT: 480px" id="I1" class="style2" src="http://www.youtube.com/embed/Y0Q6md_wvC4" frameborder="no" width="650" name="I1" scrolling="no" target="I1"></iframe>

</th><td>

<embed src="http://www.xatech.com/web_gear/chat/chat.swf" quality="high" bgcolor="#000000" width="400" height="480" name="chat" flashvars="id=149611065&gn=WorkrateWrestling" align="middle" allowscriptaccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://xat.com/update_flash.shtml" /></embed>

</td></tr></tbody></table></th></tr></tbody></table>


Całość wrzucam za pomocą 'Dodaj Gadżet > HTML"
 
  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: 38
Dołączył/a: 01 Sty 2006
Posty: 8948
Miasto: Wrocław
Wysłany: 2013-02-01, 20:27   
Rozwiązanie jest bardzo podobne do tego z poprzedniego Twojego tematu.

standardowo środkuje się za pomocą marginesu bocznego ustawionego na auto:

Kod

margin: 0 auto;
w przypadku tekstu:

Kod

text-align: center;

Pierwszy kod działa jednak, gdy znajduje się w elemencie większym od siebie.

W Twoim przypadku ramka bloga jest za ciasna na te elementy i dlatego czat wystaje z prawej strony.
Zastosujemy pierwszy kod, ale zamiast automatycznego dostosowania musimy wpisać wartość ujemną, która przesunie nam elementy w lewo.

Najpierw musimy wiedzieć o ile je przesunąć. Ramka bloga ma szerokość 950px (#outer-wrapper), czat i stream razem mają 1050px (640px + 410px), zatem 1050-950=100 i to dzielimy na pół, zostaje 50.

margines ustawiamy zatem tak:

Kod

margin: 0 0 0 -50px;

możesz wrzucić tę swoją tabelę do diva w ten sposób:
Wiadomość (widoczna dla zarejestrowanych)


p.s. sugeruję poczytanie podstaw HTML i CSS w poradnikach a oszczędzisz sobie takich pytań w przyszłości ;-)
______________________________________________________
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:
adrkwi 
WordPress.Klub


Pomógł: 3 razy
Dołączył/a: 23 Sty 2013
Posty: 190
Wysłany: 2013-02-01, 20:28   

Kod

<table style="margin-left: auto; margin-right: auto; border: 0;"><tbody></tbody><tbody><tr><th>

<iframe style="HEIGHT: 480px" id="I1" class="style2" src="http://www.youtube.com/embed/Y0Q6md_wvC4" frameborder="no" width="650" name="I1" scrolling="no" target="I1"></iframe>

</th><td>

<embed src="http://www.xatech.com/web_gear/chat/chat.swf" quality="high" bgcolor="#000000" width="400" height="480" name="chat" flashvars="id=149611065&gn=WorkrateWrestling" align="middle" allowscriptaccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://xat.com/update_flash.shtml" /></embed>

</td></tr></tbody></table></th></tr></tbody></table>


lub

Kod

<table style="margin: 0 auto; border: 0;"><tbody></tbody><tbody><tr><th>

<iframe style="HEIGHT: 480px" id="I1" class="style2" src="http://www.youtube.com/embed/Y0Q6md_wvC4" frameborder="no" width="650" name="I1" scrolling="no" target="I1"></iframe>

</th><td>

<embed src="http://www.xatech.com/web_gear/chat/chat.swf" quality="high" bgcolor="#000000" width="400" height="480" name="chat" flashvars="id=149611065&gn=WorkrateWrestling" align="middle" allowscriptaccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://xat.com/update_flash.shtml" /></embed>

</td></tr></tbody></table></th></tr></tbody></table>
______________________________________________________
Powiedzialem.pl na facebooku
 
  podziel si� tym postem na:
Htsz 
Blogger Product Expert
Blogowicz.Team


Zaproszone osoby: 84
Imię: Arkadiusz Narowski
Pomógł: 816 razy
Wiek: 38
Dołączył/a: 01 Sty 2006
Posty: 8948
Miasto: Wrocław
Wysłany: 2013-02-01, 20:30   
adrkwi, Twoim kodem tego nie wyśrodkuje, bo to wystaje poza szablon i trzeba ujemnego marginesu ;) dodałem posta przed Tobą ;p
______________________________________________________
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:
adrkwi 
WordPress.Klub


Pomógł: 3 razy
Dołączył/a: 23 Sty 2013
Posty: 190
Wysłany: 2013-02-01, 20:48   

Htsz napisał/a:

adrkwi, Twoim kodem tego nie wyśrodkuje, bo to wystaje poza szablon i trzeba ujemnego marginesu ;) dodałem posta przed Tobą ;p


faktycznie, nie zwróciłem uwagi. Tak swoją drogą jest tutaj trochę zbędnego kodu.
______________________________________________________
Powiedzialem.pl na facebooku
 
  podziel si� tym postem na:
Getright 
Blogger.Klub


Wiek: 29
Dołączył/a: 14 Sie 2012
Posty: 29
Wysłany: 2013-02-01, 20:54   

Htsz napisał/a:


możesz wrzucić tę swoją tabelę do diva w ten sposób:
Wiadomość (widoczna dla zarejestrowanych)



Działa, dziękuje :)
 
  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