Jak usunąć pionowy pasek przewijania Blok SyntaxHighlighter?

Jestem początkujący w tworzeniu stron internetowych i prawdopodobnie mam podstawowe pytanie. Zainstalowałem Joomla 2.5 CMS na mojej stronie, pobrałem, zainstalowałem i włączyłem wtyczkę SyntaxHighlighter. Następnie włączona składnię bash i dodał nic więcej następujący kod na mojej stronieJak usunąć pionowy pasek przewijania Blok SyntaxHighlighter?

<pre class="brush: bash">$ uname -a 
Linux laptop 2.6.32-41-generiC#89-Ubuntu SMP Fri Apr 27 22:22:09 UTC 2012 i686 GNU/Linux 
$</pre>

Mam ten wynik

vertical scrollbar in SyntaxHighlighter's block

Jest OK, ale nie mam pojęcia, dlaczego pojawia się podświetlone pionowy pasek przewijania. Przewija tylko na jeden lub dwa piksele. Więc, co starałem się, aby dodać następujący kod do początku mojego szablonu CSS pliku

.syntaxhighlighter, 
.syntaxhighlighter div, 
.syntaxhighlighter code, 
.syntaxhighlighter table, 
.syntaxhighlighter table td, 
.syntaxhighlighter table tr, 
.syntaxhighlighter table tbody { 
    overflow-y: hidden; 
}

Nie pomógł mi i myślę, że problem jest głębszy. Czy masz jakieś pomysły na temat usuwania tego pionowego paska przewijania?

Aktualizacja Jeśli używam oświadczenie w szablonie CSS dissappear przewijania ale blok z kodem podświetlonym zachowuje się bardzo dziwnie na stronie skalowania !important.

Źródło

2012-08-25 Anonymous

Spojrzałem na przykład i odkryłem, że w tym również znajduje się pionowy zwój. Podczas inspekcji "syntaxhighlighter javascript" sam miał przepełnienie. Sprawdź, czy masz włączone kod po lub przed obejmowały css

Źródło

2012-08-25 19:43:03 nandu

Możesz dodać następujący styl usunąć pionowy pasek przewijania i dodać jedną poziomą tylko wtedy, gdy potrzebne:

<style type="text/css"> 
  .syntaxhighlighter { 
     overflow-y: hidden !important; 
     overflow-x: auto !important; 
  } 
</style>

Źródło

2012-11-08 19:21:00

Jeśli używasz oddzielnego pliku CSS, musisz najpierw usunąć wszystkie "! Important" części dla wszystkich właściwości * przepełnienia * w scCore.cs', aby ta odpowiedź zadziałała – nixda

SyntaxHighlighter ma overflow: auto jako domyślny styl (zobacz następujący fragment css w pliku shCoreDefault.css). Dlatego musimy ustawić overflow-y:hidden !important, gdy nie lubimy pionowego paska przewijania. Ale nie potrzebujemy już ustawiać overflow-x: auto. Już tam jest.

.syntaxhighlighter { 
    font-size: 1em !important; 
    margin: 1em 0 !important; 
    overflow: auto !important; 
    position: relative !important; 
    width: 100% !important; 
}

Widać SyntaxHighlighter już używany „! Important”, dlatego, można znaleźć różnych przeglądarek ma inny wynik. Z mojego doświadczenia wynika, że w Firefoksie uzyskałem zamierzony rezultat: pionowy pasek przewijania jest ukryty. Ale w Chrome pasek przewijania nadal tam jest.

Aby mieć wyższy priorytet zdefiniowanej przeze mnie klasy, poprzedzam jakiś inny selektor zakresu, taki jak identyfikator lub klasa kontenera.

ContainerId .syntaxhighlighter { 
    overflow-y: hidden !important; 
}

Źródło

2014-02-01 04:01:00

Aby usunąć pionowy pasek przewijania dla SyntaxHighlighter w witrynie można użyć poniższy fragment kodu w sekcji <head>...</head> swojej stronie.

<style type="text/css"> 
.syntaxhighlighter table td.code .container { 
    position: relative !important; 
    padding-bottom: 5px !important; 
} 
</style>

Mam nadzieję, że ten fragment kodu pomoże! :)

Źródło

2015-08-13 14:24:17 Mdhar9e

Próbuję usunąć pasek przewijania w postaci poziomej, co ostatecznie przyniosło mi korzyść, czerpiąc inspirację z posta Johna Yin'a powyżej. Żaden podzespół poniżej nie działał samoczynnie.

/* .post class is on high-level div */ 
.post .syntaxhighlighter { 
    position: relative !important; 
    width: 100% !important; 
    overflow-y: visible !important; 
    overflow-x: visible !important; 
}

Źródło

2015-10-24 19:45:57 Jameson

Jak usunąć pionowy pasek przewijania Blok SyntaxHighlighter?

Odpowiedz

Powiązane problemy