Favicon Doesn't work
Tried doing this:
<link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
, doesn't work though and my logo doesn't show up.How to create flashing lines between grid items?
Hello everyone,
I am building a menu component made of square items and I would like to link them with flashing lines, themeselves made of rounds, like a charging bar, one after another, they will be on and off. Do you know if it is possible in CSS? I am using display: grid and I would like to put these lines exactly where my grid lines are going. Which property should I use? Thank you a lot for any advice :)!...
icon svg
i'm trying to learn semantic html and css using frontend challenge. What should html tag should I use for icons that is in svg? Still the <i> tag?
Modern day replacement for<table>
In the good ol' days our site was built around the <table> as it displayed mainly tabular lists of data.
If I wanted to replace those tables with something new and funky (just because), should I look at CSS grids or is there something better suited to the job?...
HTML and CSS responsiveness issues using Flexbox
I have a simple HTML and CSS homepage, and I have a div container that uses Flexbox and contains links with pictures, but for some reason, the boxes shrink on the mobile version.
Note: I have multiple types of images (svg, png and jpeg) and multiple sizes (since some take less or more space, although they have different sizes, they fit the same visually).
```<div class="links">
<div>
<a class="link-text" href="...">...
Trying to get Link to work
Hey everyone, I have been stuck on this annoying issue since yesterday, I want to add Links for my navigation bar but I can't seem to get the path to work.
Pretty sure it's an easy fix but I couldn't spot it myself, even tried to put the file in the same directory as the components just to get a result....
Text Causing An Overflow
text still causing an overflow even when I've added '
overflow: hidden;
I notice that when I use .mn-pro-ctn{max-width: 100%; flex-wrap: wrap;}
for small screens, the text doesn't overflow. the problem is that, I don't want to wrap the cards, I want to display them in an horizontal line then use scroll
to view the rest if it overflows the viewport. ```echo '<div class="mn-pro-ctn" id="proContainer">';
foreach($products as $product){
echo '<div class="product-crd">';
echo '<h5>Lorem Ipsum is simply dummy text of the printing and typesetting industry. </h5>';
echo '</div>';...Gradient isn't smooth
So if you look at the picture I've sent you can notice the gradient having lines throughout it isn't a smooth transition how can I fix this?
Titles, tooltips, and accessibility
I'm working on a multilingual page and where other languages happen I add or . I was finding that the tooltips were taking almost 2 seconds to appear so I wanted to have a more instant notification that help was on the way. I considered colouring the text or add some other visual indicator and may still do that, but I found styling the cursor when the text is hov...
titles
where appropriate like <span lang="zh-Hant" title="flower in Chinese">花</span>
<span lang="zh-Hant" title="flower in Chinese">花</span>
<dt title="Hangeul">Korean</dt>
<dt title="Hangeul">Korean</dt>
Rotate Hexagons by their centers
So, I managed to build a hexagon with css only, but now, I can't figure out, how i can rotate the hexagon by it's own center.
Everything i tried rotates the hexagon by a corner.
Here is the code:
https://codepen.io/Ionut-Sanda/pen/ZEPjXKp...
A problem I find with Semantic HTML
I am making a dashboard website for a mobile game I enjoy. The problem I encountered with the lack of tags and I end up using too much <section> tags and not everything is a section but without it there is nothing else to use. Sure I use <header>, <nav>, <main>,<footer>, <section> but for example <article> is way too specific it's a dashboard not blog post or a cooking recipe and it doesn't have any headings.
So I am wondering there is NO SHOT screen readers gonna use it.
And is this even worth learning more, because the more I read it the more divs with class names and comments sounds less complex.
...
font family not working on h1
I'm experiencing a situation where a font family isn't getting applied to a h1 unless I set it on both the parent element of the h1 and the h1. Setting it on only the parent element does not work. I'd think that the h1 would inherit the style of the parent but that's not the case. There isn't any interfering font family styles for the h1. I'm using Brave browser. I've never seen something like this before in CSS and I've been writing CSS for 2 years. It's just very strange. How do I solve this i...
Template for the typical centered layout?
I recall Kevin's responsive course on scrimba or perhaps a video provided a simple template/recipe for those typical website layout which goes like this:
1)
header
and footer
occupy 100% of the viewport width, main
meanwhile is centered and occupies only say 80% of the width
2) main
also has a max width cap and can't grow beyond say 80rem
...In need of someone better than me at Grid
Please forgive the rudementary MS Paint drawing (I can do better if it is unclear).
I'm doing a tree UI where each node of the tree has an openable drawer.
I'd like to have it so that each Red element spans two "rows" but whose width takes up as little room as needed. The Orange and Blue need to split along the gridline at a consistent, but fluid, point,
and the blue needs to span both columns, but start after the red....
OverWriting Antd lib styles
using antd tables, which is wrapped in a card component
issue - when trying to implement pagination it's not able to be position fixed at the right bottom of the card and becomes scrollable so it moves along with the amount of data increased or reduced
...
Animation on svg icons
Hello coders.
Unfortunately I lost too much time on this, and can't figure it out.
Given the following codepen:...
Auto-Scaling SVG TEXT ---> beside auto-scaling svg shapes!
Hello world!
How can we make the text inside an svg to be scalable in a row, just like other svg, which fit the available width of the whole container and adjust their height to match other elements so they all fit.
The text should fit it's "flex area" and the other shapes would need to also fit the width of the full screen, meaning they would get smaller in height if there is a lot of text like in y example:
https://codepen.io/Goetzeiscool/pen/YzgjYKW...
using parallax in a grid, is it possible
I have been using grid and trying to apply the parallax effect to the grid. I want to know how to make it work without uysing the postion, absolute