Scrollable Dataview tables for Specific notes

[Sst]

What I’m trying to do

I want to create a scrollable Dataview Tables for **specific notes only**

Things I have tried

I’m not a coder, but have successfully manipulated many dataviews with a little help from forums.
I have gone through the below linked forum posts, deployed the following code & it affects all notes. I only want it applied to some.

@thelegend

.block-language-dataview  {
    display: block;
    max-height: 400px;
    overflow: auto;
}

Thanks a bunch!

Scrollable dataview table

What I’m trying to do Hi, some of my dataview tables can be very long, and I would like to be able to limit them to a certain height and have a scroll-bar to explore all the data, rather than the table taking up a huge amount of vertical real-estate. Has anybody tried this/have ideas? Thanks! Things I have tried I am not great with CSS, but have tried a few things, e.g., table { display: block; max-height: 400px; overflow: auto; } this successfully limits the height of the table and …

Cssclass - dataview scrolling

hi, can someone please help me i have a css code here and i want to run it only on a specific note. i think this can be done with cssclass in the meta area. how do i have to change this in the code? thanks for the help. code .block-language-dataview { display: block; height: 400px; overflow: auto; } .block-language-dataviewjs { display: block; height: 400px; overflow: auto; } .block-language-dataview { display: block; max-height: 400px; overflow: auto; }

[ariehen]

You could try this:

.dvScroll .block-language-dataview  {
    display: block;
    max-height: 400px;
    overflow: auto;
}

and put dvScroll in cssclasses of the notes you want to apply the snippet to. dvScroll can be pretty much anything as long as the class isn’t already taken by other CSS or the theme you are using.

---

https://help.obsidian.md/Editing+and+formatting/Properties#Default+properties

[Sst]

Thanks so much mate. I owe you a kidney

The caveat you mentioned, fortunately isn’t an issue. Multiple cssclasses can be taken. My requirement was for a homepage which already used a dashboard.css, & both of these snippets work together perfectly.

Further findings for those who need:
(Illustrated below) You can include code for multiple types of scroll tables in that one CSS file. So you can use a specific type for whichever note, by adding that type under [cssclasses]. Unspecified notes will default to the default dataview settings.

.dvScroll .block-language-dataview {
display: block;
max-height: 250px;
overflow: auto;
}
.dvScroll2 .block-language-dataview {
display: block;
max-height: 500px;
overflow: auto;
}

[ariehen]

Awesome!

For next time, putting your examples or code in a code block will make it easier for folks to read and copy. e.g.

.dvScroll .block-language-dataview {
display: block;
max-height: 250px;
overflow: auto;
}
.dvScroll2 .block-language-dataview {
display: block;
max-height: 500px;
overflow: auto;
}