« first day (4549 days earlier)      last day (391 days later) » 

6:42 AM
Greetings. I have a question about working with bootstrap and CSS in VSCode. I feel like I've been a pleb for years just guessing at what attributes I should be targeting for each bootstrap component when the styling isn't quite right for me. Is there a plugin that makes me smarter in this regard in some way?
For example, I now have a conflict between Bootstrap 5.2.3 and dataTables 1.13.4 whereby table-sm is ignored. table-striped, table-bordered etc. both work, but not table-sm. I've since overridden that in my CSS so I can reduce the padding, but there's still a space between the header and the first row that doesn't look right. I have no idea what I should target to change the padding for that specific location because I don't know what's available
 
 
2 hours later…
8:39 AM
Quick question: Is it somehow possible to detect if my page is displayed because of being loaded normally vs. being displayed because the user pressed the history back button in his browser?
Reason: Since some complex pages load slowly, I add a loading marker (via a class on the body tag) on window.unbeforeunload. When I go back via the browser's back button, that loading marker is displayed again in Chrome (but not in Firefox).
I'd like to make sure, that the class in question is not there after the back button.
 
@MilConDoin Welcome to the JavaScript chat! Please review the room rules. If you have a question, just post it, and if anyone's free and interested they'll help. If you want to report an abusive user or a problem in this room, visit our meta.
 
9:03 AM
From further tests: On one PC with Chrome it calls the $(document).ready() function after the back button. On another PC it does not. Tested on the same website. Both have the most current Chrome version installed.
 
 
4 hours later…
tao
12:55 PM
@roganjosh According to docs .table-sm should work. To answer the more general question, I don't know of any plugin for Bootstrap (regardless of version). You should stick to docs and, often times, inspecting their examples.
@roganjosh Consider asking a question about what should be targeted. Make sure to create a runnable minimal reproducible example as you are unlikely to get answers on CSS related questions without one.
@MilConDoin That's extremely unlikely. I'd say the one that "din't call" $(document).ready() served the page from cache so it probably didn't contain the code checking if the method was called or not.
 
 
2 hours later…
2:53 PM
@tao agree that the docs say it should work. I have no issue with making an MCVE but what bothers me here is that I feel I should be debugging this myself first and yet I have no idea how. I must be missing something that any potential answerer is using, but I'm currently blind to what it is
Docs alone won't cut it because I can already demonstrate that other things like table-bordered do work as documented, yet table-sm doesn't. The answerer must be using something to investigate this at a deeper level
 
 
1 hour later…
4:12 PM
The plot thickens... I created an MCVE here and it works. Yet in my actual site, the CSS I'm building up from scratch in its entirety is here and the table just ignores table-sm. Now I'm super confused
 
i'd argue that makes the problem simpler
you've effectively disproven your hypothesis
that's a great first step
 
I have, but if it isn't my CSS, what else could it be? I've stripped back the stylesheets for the MCVE so is something else potentially trampling bootstrap?
 
Usually, you can open the dev tools and use the element tab to visualize which elements affect which parts of the page
if you're trying to remove a blank line of space below/above a given element, then you just need to narrow down which elements are involved and then determine what is causing the space
whether it's a line break, padding, or margin
or even something flex/css grid based if you're using those systems
once you've determined the root cause, you just need to find the style that is introducing that change and create a new rule that is more specific than the rule applying it (or modify the rule applying it)
 
Thank you for rubber-ducking me here. I wonder wtf I've done because I can't break my MCVE. I haven't added dataTables to it yet, though
Back to the drawing board
 
4:49 PM
I think my question really boils down to asking how I can be more intelligent about debugging this. It surely can't be hit and hope. My MCVE works and yet my code doesn't. Now I'm left just guessing
I understand what Kevin is saying, and I know how to view that, but it feels like shotgun debugging. Are there really no ways to get a clear signal on what stuff is wrong? Mega respect if that's the case because it's super stressful when I'm used to stuff blowing up with a clear error
 
 
3 hours later…
tao
7:40 PM
@roganjosh We use Right click > Inspect > Styles/Computed. The browser shows the value of any CSS property applied and it also shows what overwrites what, so you can effectively see where something that overrides what you want applied is coming from, what selector applies it (therefore you know what specificity you need to override it). That's what we use and you probably do not.
And no, we don't use any special tools. Or at least I don't. It's a matter of learning, over time, what each css prop does and deducing what could cause a particular behavior. A lot of good programmers think CSS is hard, because at times it appears to be non-deterministic. Of course it actually is, but there are so many rules involved that sometimes one finds it difficult to explain why something works in a particular way.
 
8:05 PM
i used to apply colors to a few specific tag names that often were common culprits for css problems, such as divs/paragraphs, to see where they end/begin. but now days the dev tools provide all i need without that
 
8:44 PM
@KevinB I used to do that too lol. What would we do without dev tools?
 
 
2 hours later…
10:30 PM
 
11:22 PM
does anyone know how to write to an html file inside the extension directory (in a chrome extension)? I'm trying to look around how to do this, but the only two extension I know that do that are LinkGrabber and OneTab
I don't think there is any SO post about doing something like this, at least when I looked around
 
11:35 PM
could someone help me understand why files is undefined ?
 
@Sakthivel What is the 'filesToUpload' array?
 
@PlanetBluto Welcome to the JavaScript chat! Please review the room rules. If you have a question, just post it, and if anyone's free and interested they'll help. If you want to report an abusive user or a problem in this room, visit our meta.
 
@PlanetBluto supposed to be a simple file upload array to hold values of a uploaded images
following the directions form this npmjs.com/package/react-mui-fileuploader
 

« first day (4549 days earlier)      last day (391 days later) »