How does css grid layout works

I was wondering how does the Css grid layouts. I thought I was getting close to understand it until I tried this below. I thought it would make the item 5 go behind the 3 since it has no position defined in the grid, but instead it went after the it...
more »

2017-12-01 07:12 (1) Answers

Hide text on hover

I'm unable to hide the class "portfolio_caption" when the hover effect happens. I'm not sure if it's because the hover effect is based on opacity. I'm a little lost as to how to make this happen. Kindly note that this is a pure CSS code but I don't ...
more »

2017-11-28 04:11 (5) Answers

Flexbox sizing issue

I have a flex box with 2 elements in it side by side normally elements in flexbox automatically take all the space... but not here ... I tried to set the height manually to height:100%... nothing woks where is my mistake? (the menu element is suppo...
more »

2017-11-27 19:11 (1) Answers

Unexpected height while using flexbox model

I'm trying to make a side menu and i want to use flexbox model. But i have a problem that i haven't solved. In my menu there are some list element (like dashboard, componenets, ...). This list elements are in <a> tag. When you look with insp...
more »

2017-11-25 10:11 (1) Answers

Getting my "beer" vertical progress bar to work

I'm trying to make a progress bar that looks like emptying glass of beer. Unfortunately I'm not very artistic person but I'm doing my best. My concept goes like this: There is a <div> with "beer" background, 100% high vertically. It hides an...
more »

2017-11-22 00:11 (2) Answers

Swipe sidebar menu doesn't work in chrome

i did the menu from that template but it work only in firefox/edge/safari(ios). and doesn't work in chrome/opera and other browsers as i see in debug (F12) menu ...
more »

2017-11-19 13:11 (1) Answers

Transition from sentence to one word

What I am trying to achieve is to animate an element width few words in the way that hovered word leaves in the center of the element and the rest smoothly goes out of the bounds. I would also keep it as clear as possible in HTML and not to use fixed...
more »

2017-11-17 21:11 (3) Answers

linear-gradient IE11 white space issue

I'm trying to build a css framework for myself for some status boxes on my site. I have put up an example here: background: -moz-linear-gradient( left, #aeaeae, #aeaeae 2em, transparent 2em, transparent 100%...
more »

2017-11-16 10:11 (2) Answers

Hiding a link on click css only

i'm pretty new to coding (just started a free weeks ago with html and css). For a news page i tried to implement "read on" links, similiar to this question here: on click hide this (button link) pure css However i can't seem to make the link disappe...
more »

2017-11-15 15:11 (2) Answers

css adding delimeters to nav

I have a navigation menu that is basically a list of links that wraps on to multiple with n number of links on each dependent of length of link etc, Above is what I am trying to recreate, as you can the last link on each line does not have a deli...
more »

2017-11-15 12:11 (2) Answers

Keyframe Animation not working on iPhone

So I have an animation I'm trying to play on my website: It doesn't seem to be working on my iPhone, regardless of whatever browser I use. I've added the -webkit- before the animation as suggested by other answers but that does...
more »

2017-11-14 01:11 (1) Answers

CSS Transform and Pseudo classes

Using :after, I'm trying to create brutalist pseudo 3D button. But the :after is showing above the intended element. What I'm Trying to accomplish What I'm getting Edit: Obviously the transform is getting in the way, research has yet to yield a wh...
more »

2017-11-09 22:11 (2) Answers

CSS Animation Delay and Keyframe

I have a problem with animation delay on CSS Animation. I have 3 images and I want to make it slideshow. The illustrations is, image 1 to image 2 takes 15 seconds to change and image 2 to image 3 takes 15 seconds to change and image 3 back to image 1...
more »

2017-11-09 05:11 (1) Answers

Div disappears during CSS transition

I have two divs beside one another. With the click of a button, the div on the left collapses to the left leaving only the div on the right. Since the div on the right is width:100%;, it fills the space left behind by the collapsed left div. The on...
more »

2017-11-09 00:11 (0) Answers