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
1answer
17 views

Aligning multiple boxes on CSS

I'm struggling to align a group of boxes in the center of my webpage when displayed on a computer screen. I'm floating the boxes left but then it's assymetrical with more space on the right. It's ...
0
votes
0answers
10 views

The responsive menu does not work on website

I code the responsive menu, but it does not work. My expectation: when you click on the hamburger menu, the menu will transform to the close icon, and the full-screen menu is open (background->opacity ...
-1
votes
0answers
16 views

How to aplly same styling to multiples css classes in js object ( react js)? [on hold]

I have css like this: .hamburger-inner, .hamburger-inner:after, .hamburger-inner:before { position: absolute; width: 100%; height: 2px; transition-timing-function: ease; ...
0
votes
3answers
29 views

Not able to resize <tr> <td>

HI im trying to resize the blue button in the header image not able to. Its in a table format in a i tried using td width also it didnt work. It looks like its fixed to 640px. I tried with style ...
-3
votes
0answers
14 views

Android keyboard squashes web app. How to avoid this? [on hold]

Android keyboard squashes web app. How to avoid this? What is the workaround or approach for this issue?
0
votes
0answers
8 views

Show Store name under their products in Dokan Multivendor Plugin by weDevs [on hold]

I need help to show the store name in the products that they add as vendors, in my multi vendor site. I purchase it from Dokan but the codes that I have used only gave me syntaxis errors but I think ...
0
votes
1answer
23 views

CSS font-size in pixels: what does it meaure?

CSS has font-size that can use "px" pixels. But what exactly is being measured to be the given pixels? Take 14px, does that mean that no letter will be over 14 pixels? Is that the average size of ...
0
votes
0answers
22 views

Why the last section covers the above sections

I am trying to create the full-page parallax scroll in the one-page website. There are 5 sections in the page. When I add the code of parallax scrolling, the last section covers the above sections. I ...
0
votes
1answer
10 views

How to add font-variant-numeric: tabular-nums; to jquery?

I've been trying to apply font-variant-numeric: tabular-nums to this and it won't work also I don't know if it's supposed to work Check out for more info https://developer.mozilla.org/en-US/docs/Web/...
0
votes
1answer
38 views

What is the correct syntax for CSS (multiple ID) + (class) [on hold]

My question is the CSS syntax. I want to add a CLASS(.fade) to multiple ID(titletext1 and titletext2 or more...). The way I write it does not work. What is the correct syntax if I do not want to group ...
-6
votes
0answers
22 views

How to make half border in css? [on hold]

I want to create half border around a div. Something like this... Thanks
0
votes
3answers
28 views

Is the file named “stylesheet.css” necessary/mandatory? [on hold]

Is the first file of CSS MUST/MANDATORY being named "stylesheet.css" or we can put it as "header.css" or "sidebar.css"?
0
votes
2answers
27 views

Top border radius in linear gradient background

I am making testimonial feature in a carousel This is the sample pic of what I wanted to achieve And this is what I've achieved so far https://jsfiddle.net/2we347xu/ but this time I wanted to make ...
-1
votes
1answer
18 views

How to build Treeview navigation with showing active links on right side, tree has to allow expansion and contraction

I am new to website development. Currently trying to make treeview with showing active link on right side of tree (w3school example : treeview). I will prefer using PHP, javascript, HTML and ...
0
votes
0answers
13 views

Center Typeform Popup Button in Squarespace

Embedding my Typeform on my Squarespace website Contact Page, as "Popup", not "Right Drawer" or "Left Drawer", but I cannot get it to center. It aligns to the left. Any ideas? Thanks! Here's my code: ...
0
votes
0answers
19 views

Local JQuery and JQuery mobile files not working on localhost

I'm trying to my assignment which needs me to use JQuery and JQuery Mobile. I'm using nginx so my PC acts as a webserver. When I try to view the html on Chrome, the "data-role" property doesn't work ...
1
vote
1answer
35 views

bootstrap 4 radio button not conforming to padding

I am having an issue where the Bootstrap 4 custom radio buttons are not not in-line with my left padding. See below: Here is my code for printing an item <div class="p-4"> <ul class="d-...
0
votes
1answer
16 views

Google Maps absolute positioning overlapping fixed position Navbar

Working on an Angular application for a small business and for the life of me cannot solve while Google Maps keeps overlapping the fixed position navbar on the mobile site. When I scroll down, the map ...
0
votes
0answers
10 views

Show Child overflow of Parent with overflow hidden without changing HTML

I have a background that I need to keep the overflow hidden on a modal although I have buttons on the left and right of the modal that overflow and are cut off due to the parent's overflow being set ...
0
votes
0answers
9 views

How to override styling in react-select npm package for different viewports using className

Unable to style for different viewports using react-select npm package. Re: https://react-select.com/styles#using-classnames I'm trying to use className to override react-select styling, as it's ...
0
votes
1answer
38 views

CSS Link to stylesheet stopped formatting

Embedding my css file is usually fairly simple for me, I'm far from well versed in CSS but I am not just writing a question without first trying to fix it myself for hours. However for this ...
0
votes
0answers
19 views

Display dropdown out of iframe?

My application runs in an iframe of another web app (Tableau server). The dropdown in my application should render outside the iframe i.e. on another app's DOM. I have utilized Sumoselect JQuery ...
0
votes
0answers
12 views

How to disable dropping to element while keeping it draggable

I am building simple trello like app using native HTML5 DnD. It is working but there is some weird issue which I couldn't find solution yet, I enabled draggable element (card) to be droppable to the ...
0
votes
1answer
15 views

Laravel link to another section on different pages

I made a dropdown nav-bar, I want to link the dropdown menu to a different section on a different blade. What I want to know is how to link section of another blade into href="{{ route('somepage')}}" ...
0
votes
1answer
27 views

Navbar doubles in height on resizing

I've (almost) created a responsive navbar however between phone screen size and full window size the bar doubles in height. I've tried a bunch of bootstrap classes without success. This is the full ...
0
votes
1answer
35 views

Simple Points Counter, Javascript is not showing up

I am trying to build a very simple points counter on a website. The numbers and button press aren't showing up in the main HTML. I am somewhat familiar with javascript, but not how to implement it ...
0
votes
0answers
15 views

Issue with media query showing when regular css should be executed, and visa versa

When I am in laptop/desktop view, the regular CSS styles are crossed out in the inspect element, and the query styles are active. Why is this happening? For example, my code for the nav section (...
0
votes
2answers
39 views

How should I modify my css to make the image getting closer to my text when I narrow the browser?

guys I am new to front end development and I am trying to learn from building a page. Here is the demo. https://codesandbox.io/s/goofy-boyd-xscgd it looks fine on full-screen but when I narrow the ...
-2
votes
0answers
13 views

What's the correct way to update JQuery, Jquery-UI and Bootstrap libraries in a web App? [on hold]

I need to update Bootstrap, Jquery and JQuery-UI libraries in a Web App with Maven and Spring Boot. The update are: JQuery v1.11.3 to v3.0.0, JQuery-UI v1.10.4 to v1.12.0 and Bootstrap v3.3.6 to v4.1....
0
votes
0answers
13 views

BootStrap 4 make different size images same size in row of columns

I'm trying to make a responsive row of 4 images that are the same size even though there different(640x799, 640x479, .....). I've been trying to do it with columns and img-fluid, but the shorter size ...
0
votes
0answers
16 views

Trouble with displaying MarkJS matches

I'm working on a jquery search (mark.js) that highlights words on a page based on user input. I'm able to highlight the results, but the results do not display i.e. "1 of 1 matches". The matches ...
0
votes
1answer
18 views

I have a horizontal scroll on my web page that I can't get rid of

I've built a page using Bootstrap 4 and my footer has a 20px gap to the right hand side. There is a horizontal scroll on the page as well, which I thought was the footer so I deleted and it made no ...
0
votes
1answer
17 views

Webpage will not render specified font

I am having an issue with the webpage because the browser keeps rendering its own font, Open Sans, below is what the chrome inspector shows: font-family: 'Open Sans', 'sans-serif'; The ...
0
votes
0answers
11 views

dropdown menu on last table cell gets cut off - React Bootstrap

I have a react bootstrap table, the last cell on each row has a dropdown menu. It's fine until the last row, the dropdown menu gets cut off due to overflow:hidden in the table element. I would like ...
-4
votes
1answer
20 views

How to insert a 3D Photo using only Html and Css [on hold]

I created a 3d photo and i want to upload it to my website, and by animation that photo will be always rotating like a 3D Photo, but the command <img src="example.glb" alt="3D Photo"> doesn't ...
0
votes
2answers
18 views

Vuetifyjs solo text field styling by reducing the height doesnt work

I have added a solo text field in vuetify js and centered it in my toolbar but i want to reduce the height of the text field so that its neatly arranged on the toolbar So i have <v-toolbar ...
-3
votes
0answers
21 views

Infinite scroll on my Tumblr blog stopped working

<!DOCTYPE html> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gbk"> <title>{Title}</title> <link rel="...
0
votes
1answer
27 views

How to draw Rectangle on SVG with mouse Move?

I found code on someone's fiddle to stroke on mouse move (click and move strokes). My Requirement is to stroke Rectangle on a SVG with mouse move in the same way . is it Possible, if yes how ? //...
0
votes
1answer
22 views

Angular 7 - Material component CSS not loading

I am working on a new Angular 7 project and trying to use the out of the box material components. Some of the css is not being applied and i cannot seem to discover why. For example, I have an ...
0
votes
1answer
42 views

Parallax and fixed nav

I using a parallax effect on a home page with a fixed nav bar that works fine, however for the other pages that don't have the parallax effect, the fixed nav is broken. you can see the working ...
0
votes
1answer
20 views

Overflow-y Not working on `Position: Fixed`

I have a mobile menu's sub-menu (nested list) that I would like to scroll which has position: fixed. I thought to make this scroll to show all the content you would do overflow-y: scroll as per this ...
1
vote
1answer
32 views

How to draw a SVG on Canvas using Javascript? [duplicate]

How Can I draw this svg on a Canvas using Javascript (Without using Dom) ? <svg width="100" height="100"> <circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" ...
-1
votes
1answer
47 views

I'm having trouble understanding this HTML/CSS code, [on hold]

I'm trying to set up an accordian like drop-down menu. I found some code online, but I'm having trouble understanding it. Can someone walk me through it? <h1>Pure CSS Accordion <sup>2.0&...
-3
votes
0answers
18 views

Trying to get my border-top-right-radius to be a bevel shape

I heard border-corner-radius: bevel; does not work. Tried it and confirmed that... How can I achieve this shape? Thanks for your help and input! .column1 { background-color:#004434e0; /* ...
0
votes
1answer
12 views

Hovering Across Sub-Nav Visibility

I'm creating a mega-menu like dropdown navigation in my React project. Since it's a functional component, I'm using useState to toggle the state and showing and hiding sub-nav that way. The dropdown ...
-2
votes
0answers
17 views

How to apply style and change scrollTop at the same time? [on hold]

There is a need at a certain moment to apply the position: fixed style to the element containing the page content and at the same time set the scrollTop of this element equal to the scrollTop of the ...
0
votes
0answers
19 views

How to create a responsive Bootstrap navbar with 2 lines and logo in the middle of the bottom one

I'm trying to create a 2 line Bootstrap 4 header, the first having a button on the left and 3 links on the right. Underneath it, I want another navbar with a logo centered in the middle and two links ...
0
votes
1answer
17 views

Align list items under input box with flexbox

Im trying to align the ul lis under an input box and send the span element to the right of the input box I read other threads and how to send the span to the left with justify-content: space-between; ...
0
votes
0answers
25 views

Div above footer is affecting the footer styling, how to fix this?

I am trying to develop a Help me function for our users. For this purpose, I am trying to put a div right above my footer. But, my div styling is affecting the footer, and I am not able to figure out ...
1
vote
1answer
26 views

I've tried converting a HTML site to WordPress but only the content is displayed and the CSS is not working

I want a HTML site to be converted to a WordPress site with the same theme. I've added the 'wp_enqueue_style' to the functions.php file for WordPress to find the CSS file but still it's not working. ...