806,885
questions
0
votes
0
answers
13
views
Bootstraps form validation inside a table with big checkbox now working
I use bootstrap 5.3.3 and have this structure
see css used to create a big checkbox.
.form-check-input[type=checkbox].big-checkbox {
transform: scale(3);
margin: 1.5rem;
border-radius: 0;
}
...
0
votes
0
answers
15
views
Font Path is invalid in font-face
I need to use specific Font in ASP.NET Core MVC Project, So, in css file:
CSS:
@font-face {
font-family: "CustomFont";
src: url(css/Custom-VariableFont_slnt.ttf);
}
But I get error ...
-3
votes
0
answers
16
views
How to create a circular submenu that appears on hover over a circular menu item? [closed]
I'm trying to create a circular menu with a submenu that appears when hovering over a main menu item.
So far, I was able to design the main circular menu, but I'm struggling to implement the submenu ...
0
votes
1
answer
24
views
Why doesn't transition-duration work on this view transition?
This is working, but the duration setting is ignored. What am I missing?
https://jsfiddle.net/r76z0o8s/
function onClick(e) {
e.target.classList.add('clicked_media_transition')
document....
0
votes
1
answer
28
views
Zoomed images don't have different sizes according to JavaScript
Is there any way to get the actual size of a zoomed image via javascript? After adding a css zoom affect to the image and then getting the size via JS it returns the original size.
var img = ...
0
votes
0
answers
6
views
Unable to replicate PyData Fonts
I'm trying to replicate the fonts used in PyData's documentation. The custom CSS styling is taken directly from their website, however, my heading renders with a different font. PyData's docs use ...
-4
votes
0
answers
21
views
change tile to light green after mower runs over it (JavaScript game) [closed]
I am making an incremental lawn mowing web game. I need help making the grass turn light green right after the mower goes over it.
script.js
main GitHub repo
0
votes
0
answers
24
views
Hover Effects are treated as click effects, but they work properly after resizing page
They were working before, but I was trying to add react based page linking and that seemed to have broken the hover effects and now I cannot get them to function properly again. They do the correct ...
0
votes
1
answer
19
views
Change background of part of GoHighLevel form
I built [this][1] form in GoHighLevel. I am trying to adjust the background so the top part (before the form fields, header and description text) is white, and the rest a green.
I add the following ...
0
votes
0
answers
15
views
Center vertically, but keep top margin when content expands (variation 2) [duplicate]
[Originally asked here, but after I got the answer, I realized that my example was insufficient. That received a good answer, so I'm leaving it and asking the updated questions separately.]
I have a ...
0
votes
0
answers
5
views
Creating an applet error for linux mint cinnamon 22
Description:
I am trying to build applets for Linux mint, This is the first time I am entering building apps space, I was previously a web developer, so I have an idea on JavaScript. At the moment I ...
0
votes
0
answers
32
views
Uncaught ReferenceError: Function is not defined at HTMLButtonElement.onclick
I have one issue.
I have function add() on buttons with number parameter. So when I click button in console there error Uncaught ReferenceError: add is not defined at HTMLButtonElement.onclick
This ...
-1
votes
1
answer
30
views
image showed up fine, then didnt
When trying to add an image to my code, it worked at loaded fine, but now just shows the 'image failed to load' thing and the alt text. I cant fid any logical reason for it to stop working.
<img ...
0
votes
0
answers
14
views
WP CF7 how to change calendar color
I would like to change the colors in the calendar displayed in CF7 using [date]. By default, the selected day and the set, cancel, clear and header fields in the mobile version are blue. I can't find ...
-1
votes
0
answers
17
views
EmotionCSS clean up generated classes
When using the css prop from EmotionCSS, it generates a CSS class with a random hash name and adds it to the head of the DOM (as far as I can see) as well as various variants for browser compatibility....
0
votes
0
answers
21
views
HTML5 <video> background not transparent on iOS
I need to use a HTML5 video tag to display a webm file which plays in a loop. I do not want to show any video background or controls. Currently, it looks like this:
.my_video {
display: block;
...
-2
votes
0
answers
18
views
Browsers automatically evaluates HSL to RGB, but not for OKLCH [closed]
Coming from another posts in Stackoverflow, but couldn't find the one which discuss about browsers being automatically evaluates HSL to RGB, but not for OKLCH.
Here's some proofs:
Basically, I'm ...
1
vote
1
answer
18
views
Displaying a checkbox in Vue Quasar Tree
How can I remove the checkbox display for parent nodes, i.e. nodes that have children in the component Tree.
I tried it through the class.
.q-checkbox__inner) {
display: none;
But then all the ...
3
votes
1
answer
57
views
Replacing jQuery slideToggle() with vanilla Javascript
Currently, I'm working on replacing the jQuery slideToggle() function with vanilla JavaScript and trying to find a generally effective solution. My elements can have various padding, and until now, ...
-1
votes
0
answers
27
views
How to make active route link scroll to center in Angular?
In Angular, I have a Navbar, in which I have scrollable menu links. The links will start from the center.
What I'm trying to do is, that I want the active link to be scrolled to the center when I ...
0
votes
2
answers
52
views
Why is there a white space left under the div when I apply box-shadow? [duplicate]
I'm trying to make a page with 3 images, each one inside a div, but when applying box-shadow there is a gap underneath.
Image with example of the problem
<style>
body {
margin: 0;
...
0
votes
0
answers
7
views
Header and Footer in PDF(WebView2) without overlapping with the contents- using .js and .css
My requirement is to show header and footer in the pdf in all pages.
Due to some drawbacks, I am not using the WebView's header-footer property.
So I am trying to show header and footer in all pages ...
-1
votes
0
answers
41
views
Why is mix-blend-mode: difference; not working on my SVG logo? [closed]
I'm trying to apply mix-blend-mode: difference; to an SVG logo when it overlaps a specific section of my webpage, but it's not working. The blend mode doesn't seem to have any effect.
Here's what I ...
-2
votes
1
answer
31
views
Force mobile navigation menu to remain in open state
I want to apply some custom CSS rules to the navigation menu in WordPress's Twenty Twenty-Four theme. When I click menu, the menu appears. When I right-click and select "Inspect" from the ...
-1
votes
0
answers
33
views
how to make nested table with group column using ant design [closed]
I have made nested table and its work but how about if we make nested table with group column.
|2019-2020 | 2020-2021 | 2021-2022 |
| ...
0
votes
3
answers
71
views
How to prevent a div container from moving while minimize the tab
I have been creating a blog website, but there is an issue. You can see in my code there is a sidebar (red colored), it's a div container. The problem is when I minimize the chrome tab, the sidebar is ...
-1
votes
0
answers
21
views
Why some Tailwind CSS classes are not working and some even though config file is specific?
I'm creating a t-shirt shop using tailwindcss, and I have some weird problems:
When I render the ejs file (a type of file that allows for dynamic generation of html in Node.js, but is basically a HTML ...
1
vote
3
answers
44
views
transition on grid-template-columns fr to px value
I have this HTML / CSS snippet:
.test123 {
grid-template-columns: 255px 255px;
transition: 200ms;
display: grid;
gap: 30px;
.card {
border-radius: 50px;
border: 1px solid #BBD0FB;...
1
vote
1
answer
53
views
Center vertically, but keep top margin when content expands
I have a flexbox with two columns. The left content is generally taller than the right, and I want to render the right content so that it's centered.
However, the left has content that can expand, ...
0
votes
2
answers
40
views
Grid System - unable to align 3 columns in a row
I have read the docs and have googled - unable to find an answer. I have a parallax bootstrap slide. In the first slide I am trying to make 3 div columns equal height and width side by side in a ...
0
votes
1
answer
35
views
How to use SCSS mixins in angular component.scss file?
How do you use a scss mixin in an Angular component?
CONTEXT
I created a file for my scss mixins in /src/styles/_mixins.css and imported this mixins file into the global style file styles.scss like ...
0
votes
0
answers
9
views
React Vite PostCSS syntax error upon installing Shadcn Sidebar
I have a Vite+React+Typescript project where I wast trying to follow the instructions on how to install sidebar.
It automatically added some styles to my index.css file. Now, the content pretty much ...
0
votes
3
answers
30
views
Tailwind styles not applied in Netxjs project
I am working with Tailwind CSS in a Nextjs project. I have tried a simple heading but styles are not being applied.
Here is my full code on GitHub: https://github.com/mennaElbadry70/...
-3
votes
0
answers
68
views
Collapsible HTML table from 2D array
Updated the Question
My Data is this
[['RowId','State', 'Jan-24','Feb-24', 'Mar-24', 'Apr-24'
'oddheader', 'NY' 100, 200, 300, 400,
'oddchild','City - 1' 30, 50, 75, 100,
'...
0
votes
0
answers
44
views
How to make infinite animation of vertical lines moving along horizontal lines
How to make an infinite animation of vertical lines moving along horizontal lines using only CSS and HTML?
So far I have only got this option, but the distance between the lines does not decrease as ...
-2
votes
1
answer
22
views
how to create animation using css [closed]
i want to create an animation just using CSS.
I am trying to make animation in my site, any small cat animation or anything.
have to create an object which is waving to user "hello welcome" ...
-4
votes
1
answer
23
views
Problem with positioning overlay on top of Text-Image-Section
i have a problem with positioning an overlay on top of a Text-Image-Section. I tried to visualize the expected result in the attached image. The overlay (blue) should be positioned on top, without ...
0
votes
2
answers
43
views
Alert pop up when a form is submitted
I want to display an alert pop-up when a form is submitted, but it is not working as expected. When I refresh the page, the alert pop-up does not hide itself; instead, it continues to display even ...
-1
votes
0
answers
27
views
I have added media queries to my CSS and tested my page on edge, chrome and used a online mobile emulator but queries don't work
As above, I have added media queries to my CSS and tested my page on edge, chrome and used a online mobile emulator and it works fine.
However when I actually view the page on a mobile device all of ...
1
vote
1
answer
36
views
Solid color background is applying with some transparency
I am working on menu for mobile devices. When we open the menu the background is visible through it.
I have a background-color set white in #headerPop but it is not working as expected and element ...
-1
votes
0
answers
22
views
Page scrollbar appears when child element has overflow-x: scroll; CSS [closed]
I've created a simple slider. It's overflow-x is set to scroll which works. Although the overflowing content is hidden within scroll container, scrollbar for the entire page appears. There's no ...
0
votes
0
answers
17
views
Image-banner and link-wrapper not aligning to center in CSS grid layout when width is set on center-column container
I'm trying to center-align an image and a set of links in the center column of my navigation layout. When I don't specify a width for the .center-column element, the alignment works perfectly. However,...
-1
votes
2
answers
30
views
How can I create a smooth scroll effect for anchor links with JavaScript?
Smooth Scroll Only Works Once:
The first anchor link works fine, but after that, subsequent links cause the page to jump instead of scrolling smoothly.
I’m trying to implement smooth scrolling on my ...
1
vote
2
answers
36
views
Truncate text in a flexbox/grid
I want to keep all team names on one line and truncate/add an ellipsis on the right-hand side. For example: Bright & Hov... / Tottenham Hot...
I can't work out a way to fix the left column ...
0
votes
0
answers
17
views
How to dynamically highlight cricket stadiums on a map and display nearby attractions using JavaScript? [closed]
I am building a web site that features the top cricket grounds in India along with nearby tourist attractions and hotels. I want to create an interactive map where:
Users can see the locations of the ...
0
votes
3
answers
37
views
How can I remove fill color of a text and combine multiple fonts in css?
I want to achieve this look for the header on my website. Check the image for reference.
For example, in the word "Creative," I want the "t" to be a different font and have no fill....
-2
votes
0
answers
20
views
How to place dropdown menu in free jqgrid top toolbar
Bootstrap 5 dropdown menu is placed to free jqgrid toolbar using
$("#list").jqGrid({
toppager: true,
colModel: [
{ name: "name", label: "Client", width: 53 },
...
-4
votes
1
answer
44
views
Website looks different on different browsers [closed]
I have this webcomic website and the image for my selection tab is moved differently on each browser for some reason and this problem has only popped up recently. It seems to only be on my desktop ...
1
vote
1
answer
23
views
Angular click event handler doesn't fire when changing containing element style from display:none to display:block
I have an issue with a click event handler not firing when its containing div was originally hidden, then later displayed. The code below is Angular, but I am uncertain if this is an Angular issue.
...
0
votes
1
answer
38
views
How do I put a button to the bottom of a box?
I have recently started using html in order to create a website for my project. I have planned on making this website that contains the intro page, that has a button, revealing further contents.
This ...