CSS HTML Validator Support » CSS
95 FOLLOWERS
CSS HTML Validator Support is for holding discussions on CSS HTML and web development discussion (HTML, CSS, Accessibility, SEO, etc). This section is dedicated to discussing Cascading Style Sheets.
CSS HTML Validator Support » CSS
2y ago
i am facing problem about flexbox property
this property is not working on my laptop vs code please some one check this code <ul>
<h1> flex-grow not workoing</h1>
<code>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>flexbox challenge 3</title>
</head>
<style>
aside{
height: 100%;
width: 200px;
background-color: rgb(211, 35, 35);
float: left;
}
.container{
display: flex;
flex-direction ..read more
CSS HTML Validator Support » CSS
2y ago
I am not aware of any performance issues/specs with the placement of @keyframes in CSS style sheets.
I think if there were any "serious" issues that they would be mentioned here:
https://developer.mozilla.org/en-US/doc ... @keyframes
Personally, for performance and battery life (for devices using batteries), I'd avoid animations unless you are sure that they are worth the potential performance and battery life hit. Of course simple animations that are short lived shouldn't be too bad but going overboard with them might cause issues.
In any case, I doubt the location of @keyframes in a style ..read more
CSS HTML Validator Support » CSS
2y ago
Conventionally, @keyframes rules are placed at the bottom of a style sheet. But from a performance standpoint, wouldn't it be better to put them at the top of the sheet so that when an animation is referenced in a style rule, it's already been parsed by the interpreter and can immediately be enacted?
This is probably a low-level question. I reckon that the sheet is fully parsed and reconciled (re: rule specificity) before any of it is applied, but it hit me: just as you need to declare a variable/function in JavaScript before you can reference it in your code, shouldn't @keyframe animations b ..read more
CSS HTML Validator Support » CSS
2y ago
Thank you for pointing me to the right spot. Having any of these options just puts the table in the section at the left edge of the broser window, without being centred:
Code:
section {display: justify-content: center;}section {justify-content: center;}section {display: flex; }
However, the following has worked the way I want. Narrowing the browser window moves the table in the section to the window's left edge and fixes it there:
Code:
section {margin-left: auto; margin-right: auto; width: 68.250em}table {table-layout:fixed; border-style:none; width:68.250em;}
Thank you very much for ..read more
CSS HTML Validator Support » CSS
2y ago
What happens when you remove
Code:
display: flex
?
My initial thought is that that has something to do with it.
Statistics: Posted by Albert Wiersch — Wed Oct 06, 2021 3:53 pm ..read more
CSS HTML Validator Support » CSS
2y ago
Hello (first post),
Every week I send an html file to a small mailing list. The file contains just one table and nothing else. When I started doing this I created the table in Excel and saved it as a single-page html file. The file contains a lot of repeated selector properties in the css style part and repeated classes in the <td>s. I am now trying to produce an identical output using just HTML5, CSS3 and, of course, Validator Standard.
I have succeeded so far and the HTML5 output looks the same in a web browser as that from Excel. The problem is an annoying difference in the way they ..read more
CSS HTML Validator Support » CSS
2y ago
I figured out a different way to make this happen, but will save your code for future use.
Statistics: Posted by paulp575 — Mon Aug 02, 2021 7:00 am ..read more
CSS HTML Validator Support » CSS
2y ago
If I am understanding correctly, it sounds like you should use class selectors.
Like this CSS:
Code:
th.greenbox { border-right:1.4em solid #0BDA51; }th.redbox { border-right:1.4em solid #ff0000; }
With this HTML:
Code:
<table><tr> <th >(year)</th> <td>Green Text here</td></tr><tr> <th >(year)</th></tr></table>
Does this do what you want?
Statistics: Posted by Albert Wiersch — Mon Aug 02, 2021 5:11 am ..read more
CSS HTML Validator Support » CSS
2y ago
Not working because I didn't provide all the details.
Let's try again - sorry.
Here's the original code:
Code:
<tr> <th >(year)</th> <td>Green Text here</td></tr><tr> <th >(year)</th></tr>
Note: The second row which is red has no text (some red rows MAY have text).
I'm thinking I need to use the id selector?
The end result would be one line with the year in black (default color) and a green box to the right of the year and then some black text to the right of the green box.
The next line with the year in black (again, defau ..read more