Questions tagged [css]

CSS (Cascading Style Sheets) is a representation style sheet language used for describing the look and formatting of HTML (Hyper Text Markup Language), XML (Extensible Markup Language) documents and SVG elements including (but not limited to) colors, layout, fonts, and animations. It also describes how elements should be rendered on screen, on paper, in speech, or on other media.

Filter by
Sorted by
Tagged with
0
votes
0answers
4 views

Button does not respond to DOM cssStyleDeclaration

I am sure this is a simple bug but I´ve been over an hour trying to find where the problem is and definetely could use a different point of view. In the following function I change the style of two ...
-1
votes
0answers
10 views

Navbar doesn't stay expanded after clicking on a sub menu link in the navbar

I've a navbar on the left side of my webpage. This is a collapsible navbar and it expands when you hover over it. Once it expands, we can click on pin icon to pin the navbar so that it always stays ...
0
votes
0answers
10 views

VueJS position multiple children with canvas components inside parent

I have multiple components that essentially are simply canvas elements with event listeners for interactivity. I have set the height and width of the canvas elements via JavaScript inside each ...
0
votes
0answers
4 views

How to deploy a project made in PHP with MVC structure in Google APP Engine?

I hope you can help me, I have the following problem: I am uploading my PHP project with MVC structure to Google App Engine, when I deploy everything is fine, but when I show it in the browser, I do ...
0
votes
0answers
8 views

Images slideshow looping and animated with the rotation effect

I'm sure this exists but I don't know how it is called, so I don't succeed at finding it on the internet. I'm trying to do an image presenter which can loop with a rotate effect, very similar to what ...
1
vote
2answers
14 views

getComputedStyle not being updated when updating style for test

I want to create a mock div that has display: none for testing purposes. However, setting the display in the test and then calling getComputedStyle shows no change in the style, i.e. const parent ...
0
votes
1answer
9 views

Having issues making an embedded youtube responsive but not so huge on my desktop display

I am trying to make my responsive embedded youtube video not appear so large on a regular desktop display. It looks fine in mobile, but when trying to adjust the size to make it look good on desktop ...
0
votes
1answer
11 views

make grid items automatically fill empty spaces

I have the following CSS grid system that has 4 kinds of different cell sizes: small, wide, tall and large. In a desktop version I've made them in a puzzle like shape that looks good but to make it ...
0
votes
1answer
30 views

Increase the time on the progress bar

I have a website that does subtitle translation but before translating the subtitle progress bar finishes loading and shows a download button so my visitors save the incomplete subtitle. Is there any ...
0
votes
1answer
25 views

z-index not working with absolute positioning of elements

I am creating a component like the stacked cards, I am having all cards positioning as absolute but facing issues with z-index property, The cards doesn't seem to change with respect to z-index. &...
0
votes
0answers
16 views

How to filter elements based on two seperate filters using jQuery

I have a blog where I have built a custom dropdown filter, and I have it working with one dropdown as you will see here: https://codepen.io/Canvasandcode/pen/zYYqQNx Here is a preview of the jQuery ...
0
votes
0answers
9 views

Bootstrap 3 tooltip arrow does not display properly with multiline message

I have a link with a tooltip on it. The tooltip message is a bit long so it's displayed on two lines. <a href="/link/1234" class="tooltips" title="See the comment">Comment</a> My problem ...
-4
votes
0answers
30 views

Book about html and css [on hold]

Is John Duckett's html and css book from 2014 or 2015 (idk) good today.I took a look at some udemy complete web development courses and I noticed that this book has more chapters and more info about ...
-1
votes
0answers
25 views

How do I get two dropdowns side by side

Currently trying to put to drop downs side by side and center them, however, my current implementation floats one drop down to the right and the other one remains in the center. I used `display: ...
0
votes
2answers
33 views

How to make a disappearing glow effect

Let's say i have a button class .mat-cancel-color { width: 160px; border: 1px solid #dddddd; color: #dddddd; background-color: white; border-radius: 25px; } and whenever i click ...
0
votes
0answers
14 views

CSS splitting per page in Next.js

I need my css stylesheet split into many files, one per each Next.js page. How to implement this? I tried to use next-css and just import a css-file into each page. It almost works. However the css-...
-3
votes
3answers
37 views

How to hide an element via CSS? [on hold]

How can I hide this element using CSS? <nav itemtype="http://schema.org/SiteNavigationElement" itemscope="itemscope" class="overlay-navigation visible" role="navigation" aria-label="Elementor Menu"...
1
vote
0answers
24 views

Scroll-snapping breaks jQuery animated scroll

I have a scroll view with mandatory scroll-snapping: scroll-snap-type: y mandatory; I also have some buttons which provide shortcuts to the different elements of the scroll view. When a button is ...
0
votes
3answers
36 views

Displaying the subelement on hover

Given the following HTML code: .hormenu { text-decoration: none; color: black; padding: 0px 10px; } .hormenuParent { display: inline; } .hormenuParent:hover { background: #...
-5
votes
0answers
13 views

How to make a line pointer with text above the image using SVG? [on hold]

Trying to find the plugin which helps me to create "stroke pointers", or "line tooltips", or "dimensions referencers" over images (tried to google all of this stuff with no luck), found only http://...
-1
votes
3answers
41 views

Float left and right on same line but treat differently when spills onto second line

Take the following simple example: https://jsfiddle.net/ds9b1gyr/ with HTML as follows: <span style="float:left;">| this is a first part |</span><span style="float:right;">| ...
0
votes
0answers
7 views

Tinymce Angular7: Not loading custom css file via content_css property

How do I load custom CSS file to use with content_css property? I have been searching around the web, but I can't seem to get the answer to this question or at least I couldn't understand it. So I ...
-3
votes
0answers
20 views

How can we give background colour to checkbox? [on hold]

it will look like a button but it should work like a checkbox? please anyone can tell me how to do it? I need to event catch it event also with the help of jQuery Thanks in advance.
0
votes
2answers
21 views

My first HostGator based website is not connecting html and css

I'm trying to connect my HTML homepage to my CSS stylesheet. It works on my computer but it does not seem to work in the Hostgator server. I don't know what I'm doing wrong. I tried looking around ...
1
vote
1answer
61 views

I need to link to another HTML page inside my current HTML page using JavaScript or HTML

I am creating a web-page that has other pages nested inside of one main HTML file. So far, I have managed to get a working tab system in for its navigation menu, but instead of showing internal <...
0
votes
0answers
25 views

How to click one circle among others in canvas using JavaScript

I want to click each circle separately from an array of circles. Because I want to do different tasks for each circle after being clicked. Though multiple circles are stored inside the array circles[] ...
0
votes
2answers
23 views

Make a row of big images fit to flexbox

.d1 { background: lightblue; display: flex; padding: 5px; } img { flex: 1; } <div class="d1"> <img src="https://upload.wikimedia.org/wikipedia/commons/3/3c/...
0
votes
0answers
15 views

Safari bug using CSS transition-delay and CSS filters

I'm having an issue with CSS transition-delay not working correctly in Safari when used to transition CSS filters. It works fine in Chrome but in Safari the animation happens then happens again after ...
0
votes
0answers
10 views

Background Images not in scrollable View in IOS 13 ionic 3

ion-card backgroud Images not Loading. after scrolling down images are not showing completely. Content After scroll Not loading properly but when click on any card it loads image and go to another ...
2
votes
1answer
31 views

Best way to manage height of angular components to fit in screen

I am having troubles with height of my components... I have a mat-toolbar in a component called app-navbar, and I have another component called app-sidebarwith a mat-nav-list (which is a side left bar ...
-1
votes
0answers
14 views

How Can I make custom borders in css? [duplicate]

I'm looking for a solution to create the border for a Wordpress website that is a bit different. The left and right borders are ordinary colored borders, while the top and the bottom are like rounded ...
0
votes
0answers
17 views

Animation not triggering when using material UI

I encountered an issue when adding material UI to my already existing application. Basically what's happening is that when I add material UI components to my modals, the entering animation of the ...
0
votes
0answers
12 views

SVG text, tspan font-size and centered

I have an issue with font size on SVG as us can see in svg the font-size:16px different from paragraph font-size but the they have the same value 16px. I would like to have font size in svg such on ...
0
votes
0answers
19 views

Is it possible to reposition a <div> into another using bootstrap?

I am currently working on a landing page that uses bootstrap's grid system for positioning and the desktop view has the layout looking something like: |h1|--------------------|p| |Button| The ...
-1
votes
1answer
20 views

How to style just one from two identical tables using css and html? [duplicate]

i have two identical tables: <html> <head> <style> td, th { text-align: left; padding: 28px; } </style> </head> <body&...
-1
votes
0answers
34 views

Chrome has bug in Rem Calculation?

Rem Calculation within 0.3125rem becomes wrong if we shouldn't gave default font-size for root element in Chrome for example, In below code I haven't gave font-size for root element. so it takes ...
0
votes
0answers
26 views

How to Extract and Parse HTML to Replace List-Style-Type

I have a widget that pulls certain data from my event calendar. When it list each event it adds a number (bullet) to the left of each event likeso: Title of Event November 1 @ 6:00 pm - 10:00 pm CDT ...
-3
votes
0answers
24 views

When mouse over open a popup , also hover section o change color [on hold]

I want to make an interactive map. I have tried many things but without result. <img class="alignnone size-full wp-image-844" src="https://acagency.it/wp-content/uploads/2019/10/Harta-01....
-3
votes
1answer
32 views

Need the text from a php wordpress page [on hold]

I downloaded a clients wordpress folder to my computer, now they want the text that was on the page. I have tried to upload the page again, but the file I got from downloading is so big and confusing ...
0
votes
0answers
35 views

Reduce the space between hr class and text

I have some divs in between I have 'hr' lines. There's automatically space between them .I want to reduce it . Please refer the image link below... [The space pointed by arrow is what I want to ...
0
votes
0answers
22 views

Background-repeat: space seems to stop working when parent gets too wide

I've been playing around with space and round values for background-repeat. In theory this should mean I can use a radial gradient to create a nice dotted border on an element without the dots being ...
-3
votes
1answer
32 views

How to change background-color of input when selected

I can't change the background-color of the input when an option is selected. When it's not is transparent. this is when options appear in my input with transparent background when i choose an option ...
-3
votes
0answers
53 views

why css don't load fonts-family [on hold]

I do not know what I am doing wrong. I was learning how to make a basic html and the YouTuber was able to us the code: font-family: Arial, Helvetica, sans-serif I attempt to do the same, but “sans-...
0
votes
0answers
17 views

Switching @import sass modules (files) in Vue (Vuex) to change color themes

I'm trying to get my head around the best approach to this (or if it's even possible). I have a rather large application i have set the color sass variables globally within two separated files - ...
0
votes
1answer
13 views

How to load CSS file dynamically by taking css file path from backend only? And where to bind that path in template?

I have to load css according to some parameters, that come from backend. If RoleID is 1 then I want to load role1.scss and for RoleID is 2 then I want to load role2.scss. Here i'm taking css files ...
0
votes
0answers
19 views

Angular Material cdk-container and main site fixed header z-index override

I have site with fixed header in angular material with z-index of 1100. While i have some mat-menu in my site which overlap the header with z-index:1200 and had class cdk-overlay-container (angular ...
0
votes
1answer
30 views

I am not able to get the following HTML document ouput! (html-css-javasciprt)

[link for the css]:https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/the-html-head/style.css [link for javascript code file]:https://github.com/mdn/learningarea/blob/master/...
0
votes
1answer
35 views

Having a dynamic background for html page [on hold]

I want to beautify my webpage by setting a dynamic background(i.e. mp4 or gif) for whole page and the most eye-caching thing in the page is going to be this. But yet I'm not sure if it's a good idea ...
2
votes
1answer
63 views

How to move a div depending on scroll percentage

I'm trying to make some animations for my application but I can't figure it out. I want the text and description to move depending on how much of the page scrolls. For the first div I managed to do it,...
0
votes
6answers
33 views

CSS - Div focus change blue border highlight color

I have div with tabstop index set. When on focus there is currently a blue border highlight. Is it possible to change this highlight color? And if so can it be done purely in CSS? Below is what I've ...