Questions tagged [css]

Ask Question

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.

685,813 questions
Newest
Active
Bountied
6
Unanswered
Filter by
Sorted by
Tagged with
0
votes
0answers
12 views

I don't understand how to use local svg file

this is the svg https://gist.github.com/Mautriz/8a936e0d1df136459d2c7f133d9b50d9 It's in a file called "test.svg" inside the same folder of the html <svg height="400" width="400"> <use ...
0
votes
0answers
23 views

how to pop a div out of the hidden flow

I have table with multiple columns and row that renders simple data. The last column is the action column whose each row contain a dropdown - edit/stop functions. On the last row, the dropdown get ...
0
votes
0answers
12 views

Problems in replacing HTML background-image with video object

I am trying to replace a background cover in a rich html file (a page from video streaming site that had a movie cover background) with a video equivalence. While it looked good on my laptop, when I ...
0
votes
1answer
12 views

Stacking responsive images in a container on different screen widths

So I have this layout at a larger display: https://i.ibb.co/5kqvDZj/big.png I started with building the mobile version https://i.ibb.co/CsdS9mS/small.png Now the two images should gradually move ...
0
votes
3answers
25 views

CSS - Img tag and display: block property

img { background-color: lightblue; display: block; } .d1 { background-color: blue; } .s1 { background-color: orange; display: block; } <img src="https://placehold.it/50x20"&...
0
votes
0answers
6 views

footer appears broken on IE11

My website's footer appears to be broken on IE11 browsers while appearing fine across other browsers and platforms: Html code for the footer: <div id="contact" class="offset"> <...
0
votes
0answers
9 views

How to find out entry ID for google forms dropdown?

I have successfully managed to embed a google forms form with bootstrap, It sends the data to the forms just fine through finding out the entry id for each area of the form (name, email, etc) however, ...
0
votes
1answer
14 views

Right click being disabled on AUDIO

So I have seen stuff to disable right click but I was wondering how do you disable it for AUDIO. JS: document.addEventListener('contextaudio', event => event.preventDefault()); HTML: <...
1
vote
2answers
34 views

How to vertically and horizontally center a custom horizontal scroll menu

Hello I am new to html and css, my goal is to create my home page for my own website/portfolio however I am having a lot of trouble. I have created a horizontal scroll menu with custom text however i ...
-1
votes
3answers
23 views

How do I center text in div with fixed width?

I am trying to center text within a div with a set width. I don't set the width the text centers if I do it doesn't. I need to set the width because it affects the size of the larger container and I ...
3
votes
1answer
29 views

In React Is there a way to change the background color of a parent Label tag on a Radio Input checked?

I am using React Semantic UI. In css I am trying to change the Background color of a Parent label of an input, so when the radio button is clicked it changes colors. I am hiding the radio button with ...
3
votes
1answer
22 views

Image and Title hiddenwhen using clip-path: polygon HTML/CSS

Guys a beginner doubt: this is my html code and css file: div.front-page { background-color: #cddaee; clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 2vw)); /* height: 500px; */ ...
0
votes
2answers
21 views

how to adjust margin session flash in php?

I am trying to flash a success message when data store successfully. My database code and every other thing working fine but when I give $_SESSION success message it always come under navigation. 1) ...
-1
votes
0answers
7 views

mysqli_query() expects parameter 1 to be mysqli boolean given [mysqli_fetch]

warnig:mysqli_fetch_array() expects parameter 1 to be mysqli_result, boolean given in (give me solution) <div id="panel_prawy"> <h2>INFORMACJE O PACJENTACH</h2> ...
0
votes
1answer
19 views

Nested Radio elements are treated like they are all on the same level on the DOM

I have an accessibility conundrum. I made my own custom radio buttons, and I'm trying to make them accessible friendly. I have nested radio buttons. There is a parent, where you select the type of ...
0
votes
2answers
24 views

Home page sections layout

I'm realizing a new website. I have attached an image of how I would like it to be the base of my home page. I ask you please what is the best method to create these three colored sections. The first ...
0
votes
0answers
9 views

Twitter Bot runs locally but does not work when its deployed on Heroku [duplicate]

I made a twitter bot that tweets an image with a quote on it every two minutes. The app is working fine on my local machine however when I upload it to Heroku it uploads fine and shows no errors but ...
0
votes
1answer
21 views

CSS grid align items not same size

I want to recreate the same design as the second image below using CSS grid. I got a problem with the alignment, of course because of the two spans the inputs are not aligned like they should be. I am ...
1
vote
0answers
24 views

Why does this Material-UI Grid item move when I click on it?

I am developing a React app using Material UI. I am having an issue with one page of the app. That page contains some text and a button, which are vertically aligned with one another. It also ...
1
vote
0answers
13 views

Insert logo Rmarkdown (pagedown)

Guys I am having trouble inserting a simple logo in rmarkdown. Can you help me? This is my code: --- title: "Untitled" author: "Me" output: pagedown::html_paged: self_contained: false ...
-4
votes
0answers
17 views

I have Football Prediction web-application in flask. We have some issues in routes or some where

I download code one system to another. But some pages are not working. I think they have some routes issues. You can download the code google link. https://drive.google.com/open?id=...
0
votes
2answers
26 views

Is there a way to make this dropdown appear like a table?

I am trying to fix this navigation. I want to make the dropdown on Animals (Alpacas, Buffalo, etc) to be split into 2 or 3 sections so the list will not be so long. Here is the code: @charset "...
0
votes
1answer
18 views

How to add a 'Add Course Button'

I was wondering how you make a 'add course button'. For example, with Duolingo, when you add a language course, it is automatically added to the drop down navigation bar. I would love to know how to ...
1
vote
1answer
29 views

How should I set the height of this div element to make it responsive? [duplicate]

I have a problem with my CSS code. I want it to be responsive but whenever I set height property of .menu-button I get this problem: After using % height And before I use it, everything works just ...
1
vote
1answer
48 views

Changing background color of form field affects size and style

I am seeing potentially strange behavior of web forms when modifying them via CSS. I have the following HTML code of a simple web form: .email { background-color: #FFFEEE; } <form> ...
-1
votes
1answer
21 views

How to remove one corner of a div [duplicate]

I have two containers, one with a red background, and one with a white background. The one with a white background partially overlaps the red one, and I would like to create the effect that you can ...
0
votes
2answers
22 views

How to Get Links to Work with JavaScript-Generated Z-index

I am repurposing a codepen and I have run into an issue with the links inside of the dropdown boxes not working due to z-index that is being generated by the jQuery. The code in the original pen also ...
0
votes
1answer
21 views

CSS size of input::before same size as input [duplicate]

I'm using a submit button with a gradient color for the background. I would like to animate that color on hover, though gradient color is not an animatable property. I found a good CSS trick to make ...
1
vote
1answer
23 views

flex items and negative z-index numbers [duplicate]

We can define an element within another, but command to appear behind its parent using z-index: -1: <div style="position:relative; width:100px; height:90px; background-color:#F00;"> <div ...
-1
votes
0answers
9 views

xenforo 2 issue css style not rendering accasionally

I have a problem concerning my website https://noujoumtounes.com (Xenforo 2) that I have not found a solution. Css style not rendering on the first login. I contacted my hosting provider website which ...
2
votes
0answers
13 views

Ionic 4 Angular: Is it possible to have a fixed element in content while using infinite refresher?

Consider a simple Ionic page's content: <ion-content> <ion-refresher slot="fixed">...</ion-refresher> <div *ngFor="let item of items"> ... </div> ...
2
votes
2answers
42 views

How do I use cookies to remember a button toggle or class in html?

How can I use cookies to remember whether dark mode is turned on and keep it active? Here's my code: $(".inner-switch").on("click", function() { if ($("body").hasClass("dark")) { $("body"...
-1
votes
0answers
30 views

CSS class [.class [letter] ] what is it? [duplicate]

I am trying to learn CSS menus. Some sample code for a popup menu shows the classes: .sidenav { } .sidenav a { } it appears "a" is some sort of keyword, because ...
1
vote
1answer
31 views

how to set sidebar and content height in react?

I was making a simple webpage with reactJs. it's still not functional but before i wanted design and architecture it. I am having issues designing it. Currently it looks like this https://ibb.co/...
1
vote
1answer
28 views

SVG circle stroke have a weird ending? How to spread the stroke dashes equally?

I was looking at this https://css-tricks.com/almanac/properties/s/stroke-dasharray/ and then I was looking at this https://codepen.io/team/css-tricks/pen/LGLzWq I'm especially looking at the ...
0
votes
1answer
26 views

DIV inside .row must extend border left and right to be full width

I am using Foundation's Zurb framework and I have a DIV inside a row container that must have border left and right to fill in the available space turning it into like a full-width. This same DIV ...
1
vote
2answers
36 views

Place text on the lower right of any screens

I want to place my version the bottom lower right of the screen. #CSS <style type="text/css"> .version { position: absolute; bottom: 5; right: 5; font-size: ...
-1
votes
1answer
31 views

Navbar Turn White Background When Scroll

I'm making a website for homework and the navbar is giving me a headache. Here's the website: http://cdcomunicacao.easr.pt/alunos/al8324/Proposta_1_%20Website/ I want to turn the navbar white when I ...
0
votes
0answers
15 views

Change the font and color of box title in shinydashboard

I have the shiny dashboard below in which I create boxes based on a selectInput(). I use css to change the boxes' font and font color but without result. ## app.R ## library(shiny) library(...
0
votes
2answers
29 views

Is there a way using HTML in Chrome to change the navigation bar color in Android?

I have an HTML website and I'm currently making it mobile. Is it possible to change the color of the navigation bar (at the bottom with the 3 buttons) in Android when you're in Chrome? Any help would ...
0
votes
2answers
22 views

How to store image name/value on submit in mysql from a form (i.e same as radio button)

I'm making a form and I want user to enter the name and email and choose an image from all the given images and submit so the name, email and chooses image name will be stored in database but I'm only ...
-1
votes
0answers
15 views

How to store values from radio? [duplicate]

I am building a registration form and I have a problem with radio buttons: I made a custom button (with radio not displayed) In PHP I store data that a user put, so incase of error they do not have ...
1
vote
0answers
21 views

css - Icon font displaying icons locally, some icons not showing up on published site

Ok, there was a similar thread here but the answer does not provide a solution. I have created an icon font with custom icons through fontastic.me and it worked well until I added one more icon, ...
0
votes
1answer
29 views

Flex Items Leaving Empty Space on right side of Container while Shrinking [duplicate]

#container{ display: flex; width:100%; height:100%; } #wrap { outline: 1px solid red; display: flex; width: 72%; height: 100%; overflow-x: auto; align-content: flex-...
0
votes
1answer
22 views

Pass in a stylesheet as a prop for a render in a functional component

I'm using Next.js, React, Styled JSX, and Postcss if that matters. I need to style an imported component for a specific page. Since the stylesheets are created for a specific component at the time of ...
0
votes
0answers
11 views

Popup function & tabs function conflicting?

I'm making a custom theme on Tumblr and the goal is to have a list of characters where you can then click on them for information. Clicking should launch a popup window of information, and this window ...
-1
votes
1answer
45 views

Create a Scoreboard in Javascript for a Math Quiz

I have created a Math Quiz using Javascript. I am having trouble creating a "scoreboard." I need to show the user how many questions they have answered so far and the total score. Also, for my ...
0
votes
0answers
33 views

PHP form displays on anchor click and jumps to right place in ie but not chrome. No JS

I have built a working form that does what I want in IE an upon cross testing I have found that it jumps to the lower id= in Chrome instead of the upper name= as in IE. I know the name tag has been ...
0
votes
0answers
19 views

Sketchy Zoom effect in Chrome

As I'm looking to develop a zoom on hover component in Vue, I found that codepen: https://codepen.io/ccrch/pen/yyaraz But when I hover on Chrome, the transition is not smooth, as the browser first ...
1
vote
1answer
24 views

How to get check particular checkboxes by default based on some values in angular 7

I have a checkboxes and selectbox whose values are coming from loop,but here I need to get some checkboxes checked by default based on an array of object.Here checkbox and selectbox value is coming ...

1 2 3 4 5 … 13717