Jak przybliżyć do siebie gadżety?

Jeszcze tydzień i ferie. Bardzo się cieszę z tego powodu, ponieważ już na samym początku będzie wiele zmian. Może nawet na blogu. Wreszcie zaczął się weekend i mam nadzieję, że przeczytam kolejną książkę, bo wyzwanie samo się nie zrobi, chociaż mam jeszcze dużo czasu.


Ostatnio tłumaczyłam jak należy zrobić archiwum, które wygląda tak jak moje. Możecie znaleźć to TU. Pod notką pojawiły się pytania, na które zamierzam odpowiedzieć w tym, a także w kolejnym poście, więc możecie przygotować się na jeszcze jeden wpis tego typu. Mam nadzieję, że przyda się to komuś.

Dziś napiszę o przybliżeniu do siebie gadżetów w kolumnie bocznej, o które poprosiła Tinaaa.

Dawno temu ciągle szukałam jakiegoś sposobu na to. Szukałam, szukałam, szukałam, aż... w końcu znalazłam! Nie pamiętam już na jakiej stronie, ale od tamtej pory ciągle korzystam z tego.

jak przybliżyć do siebie gadżety, blog, blogger, instrukcja, kod CSS, krok po kroku

Zacznijmy od przejścia do Arkuszu CSS. Jak to zrobić pisałam TUTAJ.
Gdy już tam będziemy, kopiujemy i wklejamy ten kod:

.sidebar .widget {
border:1px solid red;
margin-bottom: 0px;
margin-left:-10px;
width:230px;
}

 Po wklejeniu powinna pojawić się czerwona ramka wokół gadżetów, która potem nie będzie widoczna. Jest ona dla ułatwienia pracy.

Teraz nadszedł czas, by ustawić gadżety. Aby to zrobić należy zmienić następujące liczby:
0px - zmiana odległości między gadżetami
-10px - zmiana odległości gadżetu od lewej krawędzi paska bocznego
230px - zmiana szerokości gadżetu, co jednocześnie zmienia jego odległość od prawej krawędzi paska bocznego.
jak przybliżyć do siebie gadżety, blog, blogger, instrukcja, kod CSS, krok po kroku, borenium
Teraz zostaje nam pobawienie się liczbami i ustawienie gadżetu tak jak chcemy. Ramki oczywiście mogą nachodzić na siebie. Gdy już to zrobimy czas się ich pozbyć. Wystarczy w kodzie wyraz red zamienić na transparent
Warto pamiętać, że liczby można zmieniać na ujemne.


Mam nadzieję, że wszystko zrozumiale napisałam. W kolejnych notkach planuję napisać małą instrukcję, aby zrobić ładny i prosty wygląd, tak jak poprosił jeden z czytelników. Jednocześnie pokażę jak zrobić aby nagłówek był na wysokości kolumny bocznej.

Jeśli macie jakieś pytania odnośnie dzisiejszej instrukcji piszcie w komentarzach.



37 komentarzy:

  1. Bardzo dziękuję, że dodałaś ten poradnik ! :))

    OdpowiedzUsuń
  2. Dzięki za poradnik, przyda mi się :D

    ♥BLOG♥

    OdpowiedzUsuń
  3. Fajny ten poradnik - na pewno z niego skorzystam i bardzo pomocny post :) Zapraszam

    miki-and-nessy.blogspot.com

    OdpowiedzUsuń
  4. Świetny za poradnik na pewno mi się przyda :)

    OdpowiedzUsuń
  5. Dziękuję za poradnik, nigdzie nie mogłam znaleźć jak to zrobić. :)
    Zrobiłabyś poradnik jak robisz swoje nagłówki? ;)

    http://roksanasblogs.blogspot.com/

    OdpowiedzUsuń
  6. super, że dodajesz posty o takiej tematyce! :)

    OdpowiedzUsuń
  7. Nie skorzystam, ale bardzo przydatne!
    http://jagodzianka2002.blogspot.com/

    OdpowiedzUsuń
  8. Całkiem przydatny poradnik, ale ja i tak nic nie ogarniam jeśli chodzi o takie sprawy xD
    Świetny blog, śliczny design <3 Idealny nagłówek, koocham go !
    Miłego wieczoru!

    veniice.blogspot.com

    OdpowiedzUsuń
  9. Takie posty zawsze są przydatne, a Ty całkiem fajnie to przedstawiłaś.
    Fajny blog, zapraszam do siebie :)

    http://patrz-w-gore.blogspot.com/

    OdpowiedzUsuń
  10. przydatny post <3! Ja zawsze prosze o pomoc jesli chodzi o desingi, ale jak bede robic sama to napewno skorzystam z tej i poprzedniej rady :D

    juka-juku.blogspot.com skom? ♥

    OdpowiedzUsuń
  11. Dziękuję! Ja zrobie zaraz sobie archiwum!

    ¦ olusiek-blog.blogspot.com

    Obserwuję!

    OdpowiedzUsuń
  12. Świetny wygląd. Sama robiłaś, czy na zamówienie? Odp u mnie na blogu.+obserwuję

    oli-olli.blogspot.com

    OdpowiedzUsuń
  13. już dawno temu słyszałam o akcji 52 książki i cieszę się, że nadal trwa :) Sama czytam bardzo dużo, ale w wyzwaniu nie biorę udziału :)

    xwelcome-to-my-circusx.blogspot.com / serdecznie zapraszam :)

    OdpowiedzUsuń
  14. Masz piękny wygląd bloga, a takiej instrukcji szukałam już od jakiegoś czasu, jak będę miała czas to skorzystam z niej jak najbardziej ;)))
    Zapraszam do mnie : luvkarolajn.blogspot.com (obserwuję ♥)

    OdpowiedzUsuń
  15. Poradnik jest bardzo przydatny. Na pewno niektórym osobom bardzo pomożesz :)

    http://camille-and-camille.blogspot.com/

    OdpowiedzUsuń
  16. Mi wygląd wykonała inna blogerka ale takie rady na pewno przydadzą się innym :).

    Obserwuję agnieszka-codziennosc.blogspot.com

    OdpowiedzUsuń
  17. dzięki, na pewno się przyda :)
    dreamsforeverx.blogspot.com

    OdpowiedzUsuń
  18. Ten komentarz został usunięty przez autora.

    OdpowiedzUsuń
  19. ✿✿✿✿✿✿✿✿✿✿✿✿✿✿✿✿✿✿✿✿✿
    Widzę, że włożyłaś dużo pracy w ten blog.
    Naprawdę mi się podoba :)
    Z niecierpliwością czekam na kolejne posty <3
    A może obserwacja za obserwację?
    Jeśli zaczniesz, na pewno się odwdzięczę :3

    http://kate-and-her-world.blogspot.com
    ✿✿✿✿✿✿✿✿✿✿✿✿✿✿✿✿✿✿✿✿✿

    OdpowiedzUsuń
  20. A niedawno tego szukałam <3

    http://olga-olllga.blogspot.com/

    OdpowiedzUsuń
  21. ehh. mi nie chcą działać żadne kody nie wiem czemu :c

    OdpowiedzUsuń
    Odpowiedzi
    1. A wklejasz wszystko dokładnie? Chodzi o kropki itp?

      Usuń
  22. Ciekawe wskazówki ! :) Prowadzisz świetnego bloga :**

    carlyyy-m.blogspot.com

    OdpowiedzUsuń
  23. Masz super bloga! Będę tu często wpadać, sporo przydatnych informacji :)
    Również obserwuję!

    Pozdrawiam i zapraszam do mnie:
    juliett-ofc.blogspot.com

    OdpowiedzUsuń
  24. Też właśnie tego szukałam Dziękuje Ci :*

    http://weronika-lifestyle.blogspot.com/ <----- Wchodzić

    OdpowiedzUsuń
  25. super blog. Duzo sie z niego dowiedzialam! Mega!

    http://xoprimaxo.blogspot.com/

    OdpowiedzUsuń
  26. Dziękuję! Od dawna chciałam to zrobić

    Pozdrawiam:3
    amolsandamols.blogspot.com

    OdpowiedzUsuń
  27. Jaki fajny nagłówek ! :)
    Super że piszesz takie porady, mogą na prawdę komuś pomóc ! Sama tego szukałam kiedyś straasznie długo :)

    http://littleworldnessy.blogspot.com/

    OdpowiedzUsuń
  28. Ten komentarz został usunięty przez autora.

    OdpowiedzUsuń
  29. Dziękuuję ♥ Na prawdę pomocy post..
    http://mylittlesleeb.blogspot.com

    OdpowiedzUsuń
  30. Dziękuję za poradnik ♥

    OdpowiedzUsuń
  31. Świetny blog i porady, dziękuje ;)
    http://by-merry.blogspot.com/

    OdpowiedzUsuń
  32. można też wkleić to:
    .sidebar .widget {
    border:1px solid red;
    margin-bottom: 0px;
    }

    a po zastosowaniu całkiem usunąć:
    border:1px solid red;
    bo po wpisaniu transparent u mnie np zostaje czarna ramka

    OdpowiedzUsuń
    Odpowiedzi
    1. Oczywiście, że można. Czasami właśnie tak się dzieje. U mnie np działa, ale znow u mojej koleżanki juz nie. Chyba lepiej jest jednak zastosować tak jak napisałaś :)
      Jak tylko znajdę czas to aż dopiszę, by problemów nie było.

      Usuń
  33. Przydatny post! :)
    http://soelliee.blogspot.com/

    OdpowiedzUsuń
  34. Dziękuję! bardzo pomogłaś :)
    Chcesz zobaczyć mój szablon? pracuję jeszcze nad prawą kolumną ;)
    http://teddypisze.blogspot.com/

    OdpowiedzUsuń

Komentować może każdy. | Brak weryfikacji obrazkowej.
Komentarze, gdzie będzie przeważał spam będą usuwane.

Copyright © 2017 Borenium - Books and good tea , Blogger
|| Dostosowanie: Klaudia