Questions tagged [css]

CSS (Cascading Style Sheets) is a representation style sheet language used for describing the look and formatting of HTML (HyperText Markup Language), XML (Extensible Markup Language) documents and SVG elements including (but not limited to) colours, 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
3 views

'outlined' not working in Material UI Select

I am implementing Material UI `Select'for which values are coming from backend. Below is my code <FormControl variant="outlined" className={classes.formControl}> <InputLabel ref={...
0
votes
0answers
10 views

how re order columns on bootstrap 4.4

i am trying to re order the last column i have in the code below for display it on md and up on the 3 place. i put the title "I want to be on the 3 place on md anb up" on the h2 tag that correspond ...
0
votes
0answers
11 views

How to write css selector for selecting element before a given element

I have two elements inside a wrapper div. The second sibling in the view sometimes get an active class (as per the logic of UI) <div id="wrapper"> <div>some content</div> ...
0
votes
0answers
8 views

Is there a way to define css for shadow root element

Notice the date is cut off from this image. If I modify in the console with the following it will show all of the text. .select-text { -ms-flex: 1; flex: 1; min-width: 16px; ...
0
votes
0answers
15 views

Input in table causing the table width to change

So here I have a table in which I am able to add, delete and edit new data for the respective columns. <table class="table table-borderless table-responsive"> <thead> ...
0
votes
2answers
26 views

How to align overflowing text horizontally?

I have some text that can overflow the parent container: body { margin: 200px; } .container { width: 100px; height: 50px; background-color: #bbb; text-align: center; } ....
1
vote
1answer
18 views

Does zone.js have something to do with css not rendering?

I have a print preview CSS and it is all working in my current location. I've tested it in different browsers and computers and they're all working fine. But when viewed in Japan location, CSS doesn't ...
1
vote
2answers
25 views

unknown reason for html body overflowing

so I'm building a site for a class and i have a unexpected probalem with the css. at smaller sizes the body seems to expand beyond the viewport. Having set the body width to be 100vw and 100% with ...
0
votes
0answers
15 views

Bootstrap 4 Dashboard Example Responsive

Today I was looking for a dashboard theme, and I found the dashboard example on bootstrap site (https://getbootstrap.com/docs/4.4/examples/dashboard/). I liked it so much, but there's 2 things that I ...
2
votes
1answer
24 views

React changing style of NavBar on scroll

I'm practicing some React here. I'd like my NavBar to get a backgroundColor past a certain scroll point which I've done, but when I scroll back to the top the backgroundColor does not change back to ...
0
votes
0answers
13 views

Trying to Dynamically change background video as user scrolls

I am trying to create a single page website with a video background that changes video URL or source as you scroll farther and farther down. I was messing around with window.onScroll but it doesn't ...
0
votes
1answer
11 views

“Background-size: ” is not affecting background image HTML CSS Flask

It seems no matter what I set "background-size: " to in my css file, the background image size still stays chopped and too small. I've tried background-size: cover; as well as background-size: 100% ...
-1
votes
0answers
10 views

JavaFX css not applying to TabPane

Im trying to change the style of a TabPane object. I loaded the css and I can apply styles to .root but its not working for the TabPane. I copied the css code from the default css and randomly changed ...
0
votes
1answer
18 views

Highlight text with a short right margin in CSS

I want to put highlights around text, with a lefthand and righthand margin. So the result would be: It would not be: I so far have this css code, resulting in the bad example: ol.number { list-...
1
vote
2answers
32 views

CSS selector for elements before and after a fixed piece of text (divider)

I have a piece of generated HTML I am parsing. Roughly speaking, the part I am interested in for this problem looks like this: <div class="rowset"> <div class="head">...</div>...
0
votes
1answer
23 views

Angular Typescript: Add Dynamic CSS reading from Array

How do I dynamically add SCSS styles reading from an Angular array? We have an angular array with following members. class ItemList{ productName: string; highlight: boolean; } It contains ...
0
votes
1answer
23 views

How to move list items using keydown events

I want to move list items in an editable div in html using keydown events for the up and down keyboard arrows. The up arrow should move that list item up and the down arrow should be that list item ...
0
votes
1answer
48 views

Unable to toggle between two CSS styles

I'm trying to implement a dropbox menu for a project I'm working on. I've tried to follow this method down below, but I am running into issues. https://www.w3schools.com/howto/tryit.asp?filename=...
0
votes
1answer
30 views

Implement copy button functionality

I have this Bootstrap code which I would like to use to generate address and implement copy button functionality: <div class="modal fade" id="bitcoinModal" role="dialog"> &...
0
votes
0answers
21 views

Coloring Each Materialize.css Collections Action Differently

I'm currently using Fylipp's Materialize Collection Actions, and as the title suggests, am trying to color different actions in my collection items differently. I wrote a script (see the first of the ...
1
vote
0answers
24 views

Is there a way to offset css classes via calculation?

I am creating a page that is setup similar to a grid. Think a page of full of empty boxes of the exact same offset information. If I know the offset width and length distance per box in px is there a ...
0
votes
0answers
9 views

Apply CSS for page division to data-role=“page” in jquerymobile

I want to apply CSS for page division to div. I am using jquery-mobile, data-role ='page', but I am not able to do it. I am attaching picture also1
0
votes
0answers
10 views

SVG 1.1 Animation & Shape-rendering

I came across this problem, I simply have an SVG that rotates to the middle of the landing page, usually I use: (shape-rendering = "geometricPrecision") , in order not to display the Blurred SVGs, but ...
0
votes
1answer
34 views

Javascript InnerHTML not working on a DIV within a DIV [closed]

I have integrated summernote6 text editor into my website , i have a button that when pressed should change the default text content inside of the summernote6 text editor. I am using javascript for ...
0
votes
1answer
18 views

My Movie Review Wont Work and Tried Everything

So Every Time I type a movie in it dosent show up which it should I dont know what to Ive tried everything // Get input element let filterInput = document.getElementById('filterInput'); // Add ...
0
votes
0answers
7 views

Pure CSS darken color with css variable color [duplicate]

I would like to replace sass darken to pure css with rgba or hsla function as color will be css variable where user will be able to change but not sure how to acheive the same result. Currently for ...
-1
votes
2answers
41 views

how to make the text centerlized in the box in CSS? Mine didn't work

Tried to make the text, actually a link, inside "content_a" centrelized. But it's always on the right side. Could someone help to fix it? Appreciate it! here is the code for HTML .container{ ...
0
votes
0answers
18 views

How to load correctly my css asp.net Visual Basic

Yesterday I was working on my collage project , everything was running smooth so I decided to upload it to github where my partner could acces it.Today I opened the local repo and suddenly my css wasn'...
0
votes
0answers
15 views

Chrome Extension real time unblock website

First of all I know this quest has been asked a million times but nothing seems to work. Basically a chrome extension that would block certain websites at certain times. Everything is working except ...
0
votes
0answers
25 views

how should i add a picture to my css code(i guess it needs borders) [closed]

Ive been learning html and css myself and i want to add an image and a text which moves when pages moves Heres what i did p1{ color: black; font-family: courier; } #p2{ color:black; ...
0
votes
0answers
23 views

How to align my font-awesome icon to the left of the navigation main menu item in Wordpress

I am trying to display my own font awesome 5 icons on my main navigation menu (WordPress) instead of using a plugin with 4.7 icons. I thought I would start with my Home icon. So I went to my menu ...
0
votes
1answer
34 views

How to match HTML input and select styles with CSS

I'm trying to match the styles of both HTML <input> and the <select> tags with all fonts and size in their borders but I can't seem to find a solution for this. I have tried using the same ...
-5
votes
0answers
17 views

Overlaping elements in css [closed]

I have a problem with the CSS file. I can't make this. It is just look easy.
0
votes
0answers
15 views

Background-image don't resize correctly in the mobile screen using flexbox

I can't resize correctly a bakcground-image with flexbox HTML <head> .... <link rel="stylesheet" media="screen and (max-width: 768px)" href="/css/mobile.css"> <link ...
1
vote
1answer
14 views

index.html is not accessing app.js nor data.js after it is relocated to a subfolder 'templates'

I have a working static web page where the index.html successfully reads the style from css/style.css, the data from js/data.js and the logic from js/app.js. Here are the exact code inside index.html:...
0
votes
0answers
13 views

Problem with WebPage division while suing jQuery and jquery css

I am facing problem in webpage division by height and width respectively. In my code, I am also using jquery-mobile code and its CSS file. If I remove the jquery-CSS file it is fine, but with it, the ...
-1
votes
0answers
11 views

What is the best tactic to position images on a web page that are not exactly uniform? [closed]

So I am working on my HTML and CSS skills and wanted to create this design I did on Adobe. It is just a simple 1 page website that just shows more and more images as you go down of models. as can be ...
-1
votes
2answers
31 views

Use font-size property on <li> or <a>?

When creating a navigation bar, do you use the font-size property on the li element or on the a element? The result is the same, but what would you recommend me do? Is there a best practice or ...
0
votes
1answer
18 views

fitty.js only applying to first class element

I'm trying to create a fading slideshow of images which play on loop. Each image also has a caption with it that I have applied fitty.js in order to fit each caption to the width of the container. I'...
0
votes
1answer
15 views

Center Tabs and Header in R Shiny

I would like to center both my tabs and header within my R Shiny page. I have tried to use div() with class=span7, but it throws an error of missing an argument. shinyUI(fluidPage( headerPanel("...
1
vote
2answers
25 views

Create a Horizontal Card with CSS [duplicate]

I would like to create a horizontal card that will look like this: How can I make it so the "LINK with Icon" divs are evenly spaced out within their own div container? I tried using padding on ....
1
vote
1answer
18 views

Adding a link to HTML button on WordPress Astra Theme

I posted the same question earlier today that was closed but the problem I have has not been resolved. Problem: I am trying to add a link to a HTML main menu button on a WordPress Astra theme. If I ...
-1
votes
1answer
24 views

Link as an image doesn't work but works on a text

My code is simple and basic however it doesn't work and I can't figure out why. The link works great with text though. The cursor doesn't change, it stays as an arrow. <div class="container"> ...
0
votes
0answers
15 views

How to select expanded or extended font styles in CSS for cross browser compatibility?

I'm currently building a webpage using a font that comes with a set of Expanded and Extended subfamilies: http://www.gt-america.com/ What is the correct procedure to use these subfamilies via CSS so ...
-2
votes
0answers
26 views

Color not filling the card-header completely. (CSS) [closed]

I can't seem to figure out why the background color is not filling up the entire space in my card header. Here is a picture: https://imgur.com/j92zfLs This is from the Modern Business Template from ...
1
vote
3answers
57 views

How to display/hide a div in another html page

I have two html pages (produse.html and item.html) and a menu in one of them. When I click a link from the menu I need to go to the other page and in the same time display a specific div and hide the ...
-2
votes
0answers
17 views

Bootstrap 4 Navbar Dropdown Styling for Horizontal Items

I have a site with many items in a dropdown menu, and would like to display them across the dropdown rather than just a single vertical column (bootstrap's default). The dropdown menu items are ...
-1
votes
0answers
30 views

How can create a sliding div

I am trying to create a horizontally sliding div left to right and vice versa. To make the div slide just hold the white arrow of the image above and the div will slide leaving the bottom of the div a ...
0
votes
2answers
41 views

I changed the css tag li by id and not worked

I developed a timeline however in css I had li {my css li ..} and was in conflict with other classes and libraries. In order to solve this, I tried to add in html in the tag I read an id and did the ...
0
votes
1answer
4 views

Semantic Fixed Menu moves container to top of page

<div className="ui top fixed inverted pointing menu"> <div className="ui container"> When I make my menu fixed to the top, it makes the bottom container move up and I'm losing view of the ...