Episode #125 of the Stack Overflow podcast is here. We talk Tilde Club and mechanical keyboards. Listen now

Questions tagged [css]

CSS, short for Cascading Style Sheets, is a language used to control the presentation of HTML and XML documents including colors, layout, and fonts.

Filter by
Sorted by
Tagged with
0
votes
1answer
24 views

Good conduct of including numbers in css classes [closed]

I'm creating a couple of dynamic css classes, and the idea is that i get a string from an episerver context and add that to the class list of an element. I know that numbers can be included in css ...
3
votes
0answers
43 views

Simple vanilla JavaScript Carousel with tabs and pause button

I currently got into coding and I am completely self taught. Since I know that my code is far from being perfect, I am asking for advice and tips on how to improve. Feel free to drop in any comments ...
4
votes
0answers
28 views

User-focused timeline logging

I'm working on a small piece of my personal website. I'd like a timeline logging all of my relevant achievements in my career in Computer Science, in general. I'd like to implement a feature that ...
2
votes
1answer
75 views

Simple Password Generator in JavaScript

...
1
vote
0answers
18 views

Centering an item over an image with absolute positioning and flexbox

Here's how I'd usually center align an item with absolute positioning: ...
2
votes
0answers
13 views

How to differentiate web fonts font-face font-weights?

What do you guys think: OPTION #1 (same font-face name and change font-weight) ...
5
votes
2answers
58 views

Dropdown menu that opens on click using plain Javascript

I made a simple dropdown menu which opens when clicked, and closes when the user clicks anywhere outside the menu. The following is the codebase: ...
2
votes
0answers
34 views

Personal Portfolio (freeCodeCamp Responsive Web Design project)

I would appreciate som feedback on my fictional portfolio. I am doing the freeCodeCamp curriculum and a personal portfolio is one of the Responsive Web Design Projects using only HTML/CSS. I am ...
1
vote
1answer
20 views

Technical Documentation Page (freeCodeCamp Responsive Web Design project)

I would appreciate som feedback on my Technical Document Page. I am doing the freeCodeCamp curriculum and a Technical Document Page is one of the Responsive Web Design Projects using only HTML/CSS. I ...
1
vote
0answers
21 views

Callback usage with custom Stack Exchange Flair, is it difficult to follow?

So today I decided to continue refining my JavaScript skills and utilized the Stack Exchange API (v2.2) to write a "user flair" replica. In case you don't know what the flair that SE provides is: ...
6
votes
1answer
111 views

Simple input class change with vanilla JS

I am just testing how I solved simple stuff. Goal: The aim is to expand the width of an input and collapse it. When mouseover ...
7
votes
2answers
134 views

Webpage with a preload animation using JavaScript setTimeout

I am working on a website with an animation that runs at the beginning before the content of the homepage becomes visible. I've looked at some examples of preloaders and now use that code with some ...
1
vote
0answers
48 views

eCommerce Mockup App in Vanilla Javascript [closed]

I have completed this mockup eCommerce app using pure Vanilla Javascript. This version can add product into shopping cart and automatically calculate the order summary in the shopping cart. It can ...
1
vote
0answers
23 views

Using ReactJS. Div changes color on hover. On Click drops down description

Hi I have a ReactJS component that I feel is a little bulky. The component holds the information for an event, and clicking on it shows the description for the event. Clicking the event component ...
7
votes
1answer
115 views

Generating a chess board with JavaScript

In another attempt to further my knowledge in the JavaScript language, I've written a chess board generator that will essentially create a chess board with any initial state supplied. This supports ...
0
votes
1answer
70 views

The Game of Pig in JavaScript

I've implemented the game of Pig in JavaScript. My implementation has the following rules: Two players take turns playing in rounds. In a round, the player rolls a single die as many times as they ...
2
votes
2answers
43 views

Survey form (freeCodeCamp Responsive Web Design project)

I would appreciate som feedback on my fictional survey form. I am doing the freeCodeCamp curriculum and a Survey Form is one of the Responsive Web Design Projects using only HTML/CSS. I am especially ...
3
votes
1answer
50 views

Product landing page (freeCodeCamp Responsive Web Design project)

I would appreciate som feedback on my fictional product landing page. I am doing the freeCodeCamp curriculum and Product Landing Page is one of the Responsive Web Design Projects using only HTML/CSS. ...
2
votes
2answers
47 views

PHP display Error Wanings Yellow @ bottom of Page with PHP_EOL

I initially started searching for a PHP script which would output PHP errors, to the JavaScript console. As the Default behaviour is just to spit them out anywhere and displace everything else. ...
0
votes
0answers
27 views

HTML & Javascript form: Need feedback

2 weeks ago I passed a technical test for the job of a frontend developer so they give me a screenshot of a typical form and I need to code it by HTML/CSS and they request a small animation with ...
0
votes
0answers
21 views

Multiple animation control using Vanilla JS ES6

What I'm doing Divide members into five section, and apply animation for each member to reveal at first. When I click the section, it is expanded to whole viewport and introduce detail about ...
1
vote
1answer
33 views

Create a background-image over a background-color with different opacities for each element

Here the demo The code below creates a background-image over a background-color with different opacities for each element. Is there a cleaner way of achieving this? ...
2
votes
2answers
37 views

Google homepage beginner project

I was hoping to get some feedback on my basic recreation of the google homepage. Im doing the Odin Project learning course and this was the first project trying to use the basics of HTML/CSS HTML ...
2
votes
1answer
24 views

HTML and CSS word styling and screen reader usability

I’m trying to target three words in a h1 for the organization name using to wrap each word and a unique ID to style each word via css. It looks like this: ...
2
votes
1answer
51 views

Simple landing page with a countdown timer and automatic slideshow with HTML,CSS,JS

Does this code follow common best practices? I tried to keep the code simple and straight forward adding comments and spacing everything to be readable. My main concern is there a common practice ...
4
votes
1answer
39 views

Responsive, scrollable sidenav for old browsers

The following code has been tested on the latest chromium, on Opera Mini, on Safari for IOS 7 and finally, on the default web browser on android 2.3.3. As you may already know, the CSS ...
1
vote
2answers
67 views

Using flexbox to replace fixed and absolute positioning

I'm using flexbox to create a simple header, hero image with caption and footer. As you can see from my snippet, the header is fixed and the hero image scrolls underneath. Is there a way to achieve ...
3
votes
0answers
43 views

Pure (almost) CSS Masonry

I developed this CSS Masonry. It works with a CSS grid with grid-auto-rows: 1px. There is a JS ...
3
votes
1answer
40 views

Showing a unique result based on options selected

I created a simple quiz in HTML/CSS and plain Javascript. There are three questions with two options each, so there are eight possible combinations of answers, and therefore results. You can only pick ...
6
votes
1answer
55 views

Border Radius Preview Tool

I am running through an app idea to help improve my knowledge of Javascript. The code attached performs the following: Performs a regex on the input field to check it is value 0-9 If not, it clears ...
1
vote
0answers
20 views

Repetitive light-box gallery code

I'm in the process of making a website for a friend of mine who wants to display both the tattoos he has made, as well as his paintings. The idea for the layout is to have a gallery for his tattoos, ...
1
vote
1answer
27 views

Using CSS grid to align content in a non responsive div

My job is to supervise a junior developer, but I am mainly a javascript developer and my CSS skills are a bit basic. However, I spotted some things in his CSS code that seem unorthodox to me. He ...
3
votes
0answers
94 views

JavaScript `localStorage` with `document.cookie` fallback for static web sites

The Code I've got things operating as desired so far and am hoping fresh eyes can point out any mistakes or bits that can be improved, a live demo is hosted and updated on GitHub Pages, Travis-CI ...
3
votes
2answers
147 views

Cat Scoring app

Can you please review my code and suggest why it may or may not be a professional looking code? I am just starting out as a programmer I am able to write code but I don't really know where I am right ...
4
votes
1answer
22 views

Showing a “back-to-top”-button after scrolling a certain amount

I have a "back to top"-button on the page, It should be visible after the user has scrolled a certain amount*. This means I have to add or remove a class active ...
3
votes
1answer
38 views

Two CSS grids side by side, one is scrollable, the other isn't

I've made a section of my site to have two grids side by side. On the left-hand side is one big static (sticky in my case) image, on the right-hand side is a (grid) long column of several other images,...
5
votes
2answers
172 views

Crystals Collector game with four clickable buttons

I'm a few weeks into javascript and had to make a simple "crystals collector" app. The app works as intended, but the code is obtuse and repetitive. I'd like to make the app work using just one on ...
0
votes
1answer
61 views

Register Script for a website [closed]

I'm still new in web development and I am trying to develop a website with free access to doctors listing with option of booking. This is a personal project that my local community can benefit. I ...
3
votes
3answers
48 views

Simple javascript code to create an image caption

I'm trying to become better at javascript and have written a simple script that just creates some html from getting some details from some elements (e.g. the image alt text) and inserts it onto the ...
7
votes
1answer
41 views

Bash script to encode images in base64 and generate a CSS file from them

These are the first lines of code I've ever written. I've been interested in the idea of learning to program for quite a while, but never really pulled the trigger, and now I've been playing around ...
2
votes
2answers
60 views

responsive login page (html/css only) [closed]

I'm working on a responsive login page (open source). Could you try to review a bit the code on Github ? ...
6
votes
3answers
242 views

Dynamically loading CSS files based on URL or URI in PHP

I have written out the following code in the head section of my document, which should load 3 separate style sheets for each page based on the URL/URI that the user is visiting. It is working as ...
3
votes
1answer
49 views

Partial Sudoku Verifier

To practice my JavaScript for future employment, I've decided to take up the challenge of writing a javascript sudoku verifier. This code only verify's one of the ...
6
votes
0answers
49 views

CSS image slider (no JavaScript)

HTML / CSS Slider. No JavaScript. Wanted to make an all CSS Image Slider. Though there are plenty of pre-made options setup a lot seem clunky or add a lot to load time. Have ideas for some more ...
2
votes
1answer
37 views

Searching for selectors not using document.querySelector/document.querySelectorAll

I had a technical interview the other day and failed a certain question: Given a CSS selector (can just be a class name, id or an arbitrary number of selectors), return the parent DOM ...
6
votes
3answers
380 views

Class Activity Calculator

Introduction Class Activity Calculator is an online application to calculate the students' class activity grades. The class activity grade (CA) is calculated based on the marks a student gets during ...
3
votes
1answer
459 views

Dice game in HTML, JS, & CSS

I'm working on a personal game project to hone my CSS, HTML, and vanilla JS skills. I would appreciate any feedback on my small dice game project. ceelo-js Codepen The main logic of the game is run ...
1
vote
1answer
65 views

blueBox dashboard Dribble design challenge

I have coded an UI from dribble design as a challenge and completed it but I think The CSS I wrote is really bad. I am a beginner. How can I improve my CSS?. One of the main problems is that I am ...
0
votes
0answers
26 views

HTML, CSS and JS Boilerplate using Webpack, Babel, Sass and BrowserSync

I am working on a html, css and js boilerplate for my projects. My goal is to have a setup where I can fire off npm run watch and all files are watched and compiled....
1
vote
0answers
21 views

CSS organization with BEM

I've recently learned BEM & SASS, and I'd like to know if my BEM syntax is correct. I'm trying to create just the header of this page: https://blackrockdigital.github.io/startbootstrap-agency/ ...