• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Usunięcie marginesów i paddingów bootstrapowskich

VPS Starter Arubacloud
0 głosów
988 wizyt
pytanie zadane 6 czerwca 2016 w HTML i CSS przez tirex Gaduła (4,430 p.)
Już parę godzin siedze nad tym ale nie moge to zrobic dlatego postanowiłem zapytać na forum.

Jak mogę usunąc te paddingi i marginesy  obok slidera i obok tych dwoch bloczków pod sliderem.Chciał bym rozciagnąc na całą szerokość .Podaje tymczasowy adres strony :http://kancelaria.addesigner.pl/

2 odpowiedzi

+1 głos
odpowiedź 7 czerwca 2016 przez mitelak Pasjonat (23,330 p.)
wybrane 7 czerwca 2016 przez tirex
 
Najlepsza

Tam gdzie teraz masz .container-fluid nad sliderem dodaj sobie klase z takim kodem 

    width: 100vw;
    left: 50%;
    transform: translateX(-50%);
    position: relative;

Nie wiem na ile jest to czysty sposób, ale za to działa ;) 

komentarz 7 czerwca 2016 przez tirex Gaduła (4,430 p.)
działa.Tylko zdjęcia się rozpierdzieliły.Jakość do dupy niestety:)
komentarz 7 czerwca 2016 przez mitelak Pasjonat (23,330 p.)
To akurat wina zdjęć. Skoro zdjęcie ma 700 x 300 px do tego zapisane z jakąś stratą pewnie to po rozciągnięciu do takiego fullHD wiadomo że będzie jakość do dupy ;)
komentarz 7 czerwca 2016 przez tirex Gaduła (4,430 p.)
To jakiej wielkośći zalecasz zdjęcia?
komentarz 7 czerwca 2016 przez mitelak Pasjonat (23,330 p.)
Trzeba pamiętać, że im większe zdjęcie tym więcej waży, więc ładowanie też jest dłuższe.
Tutaj na przykład możesz zrobić faktycznie fullHD na szerokości czyli 1920px, ale na wysokości uciąć obrazki, żeby otrzymać wybraną proporcję slidera (bo jak da się 1920 x 1080 to zasłoni cały ekran a z nawigacją będzie trzeba jeszcze scrollować). Tutaj jeżeli zapisujesz ważna jest też odpowiednia kompresja, ale zwracając uwagę ile można sobie pozwolić żeby nie było widocznej straty.
Możesz też spróbować na przykład z 1600, czy 1366 w poziomie, ale ja bym jako punkt wyjścia wybrał 1920, uciął w dobrych proporcjach i ewentualnie zmniejszał później ;)
komentarz 7 czerwca 2016 przez tirex Gaduła (4,430 p.)
Dzięki:)
0 głosów
odpowiedź 6 czerwca 2016 przez Harsay Pasjonat (23,640 p.)
.no-padding {
    padding: 0;
}

W swoich projektach korzystam z powyższej klasy, którą dodaję do kolumn.

komentarz 6 czerwca 2016 przez tirex Gaduła (4,430 p.)
Ale samo wyzerowanie paddingu to nic tu nie da.
komentarz 6 czerwca 2016 przez Harsay Pasjonat (23,640 p.)
Wyzerowałem "paddingi" edytując źródło strony i działa :)

Możliwe, że źle zrozumiałem pytanie.
komentarz 6 czerwca 2016 przez tirex Gaduła (4,430 p.)
Możesz mi powiedzieć w kótrym miejscu u  mnie w kodzie to mozna zrobić?:)
komentarz 6 czerwca 2016 przez Harsay Pasjonat (23,640 p.)
Czy przez wyzerowanie marginesów obok slidera rozumiesz rozciągnięcie go na całą szerokość okna przeglądarki?
komentarz 6 czerwca 2016 przez tirex Gaduła (4,430 p.)
Wiem ,ze container ma swoją szerokośc teraz jest chyba 1170px.Tyle teraz ma slider.Chciałbym jakoś to usunąc tylko dla slidera i dla tych dwóch bloczków.
komentarz 6 czerwca 2016 przez Harsay Pasjonat (23,640 p.)

Jeżeli nie chcesz by slider był ograniczany przez container to musisz go postawić przed container w kodzie. Tak samo dla "bloczków"

Szybki przykładzik

<div class="container">
    <!-- jakis kod -->
    <div class="slider">
        <!-- tresc slidera -->
    </div>
</div>

<!-- zmień na -->

<div class="slider">
    <!-- tresc slidera -->
</div>
<div class="container">
    <!-- jakis kod -->
</div>

 

komentarz 6 czerwca 2016 przez tirex Gaduła (4,430 p.)
A jakiś inny sposób istnieje?Ten sposob znam .
komentarz 6 czerwca 2016 przez Harsay Pasjonat (23,640 p.)
edycja 6 czerwca 2016 przez Harsay

Możesz wykorzystać klasę dostarczoną przez bootstrapa - .container-fluid

Po prostu slider umieść wewnątrz diva z w/w klasą.

Pamiętaj wtedy, że nad nim nie powinien być w elemencie z klasą .container 

komentarz 6 czerwca 2016 przez tirex Gaduła (4,430 p.)
Harsay dziekuję za pomoc ale niestety to tez nic nie dało:/

Podobne pytania

+1 głos
2 odpowiedzi 156 wizyt
0 głosów
1 odpowiedź 181 wizyt
pytanie zadane 8 stycznia 2023 w HTML i CSS przez Mikoh8123 Początkujący (250 p.)
0 głosów
1 odpowiedź 188 wizyt
pytanie zadane 17 lipca 2023 w HTML i CSS przez Skulak Nowicjusz (170 p.)

92,455 zapytań

141,263 odpowiedzi

319,099 komentarzy

61,854 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...