css-shapes Questions
11
Solved
Is it possible to control the length and distance between dashed border strokes in CSS?
This example below displays differently between browsers:
div {
border: dashed 4px #000;
padding: 2...
Elana asked 5/5, 2010 at 7:1
4
Solved
Is there any way to create a circle with a missing segment like the picture using JavaScript or CSS3?
Drunken asked 30/10, 2013 at 12:40
5
Solved
When you go to the page http://m.google.com using Mobile Safari, you will see the beautiful bar on the top of the page.
I wanna draw some trapeziums (US: trapezoids) like that, but I don't know ho...
Mooneyham asked 27/10, 2011 at 18:44
7
Solved
Is it possible to reproduce this image using only CSS?
I want to apply this to my menu, so the brown background appears on hover instance
I don't know how to do this, I only have;
.menu li a:h...
Kroon asked 30/7, 2013 at 12:51
20
I'm wondering if it's possible in CSS to make a border but only for corner. Something like this:
**** ****
* *
* *
CONTENT
* *
* *
**** ****
Dong asked 17/1, 2013 at 20:38
4
Solved
Based on many tutorials I am able to create a zig zag border for square/rectangle objects using :after and :before. However when it comes to circles there are no tutorials at all.
I would li...
Faery asked 5/8, 2018 at 18:33
20
Solved
I would like to surround a number in a circle like in this image:
Is this possible and how is it achieved?
Clupeoid asked 1/2, 2011 at 10:7
3
Solved
Is it possible to create css ribbon in corner shaped?
.
I've tried with an png image, but is there any option to create using css ? should work with responsive views also.
.container {
width: ...
Martie asked 28/7, 2020 at 7:17
2
Solved
I want to make a hexagonal shape with border, rounded corners and transparent background in CSS3 like in this image:
I can't make this with rounded corners and border.
My code is here:
#h...
Elizebethelizondo asked 24/4, 2016 at 20:52
5
Solved
I need to create button with triangle on one side (like this http://css-tricks.com/triangle-breadcrumbs/) with linear vertical gradient and border, and I want to use pure CSS3.
It's ok if I need 45...
Dissert asked 14/5, 2012 at 8:57
19
Solved
I found this example on stackoverflow:
Draw Circle using css alone
Which is great. But I'd like to know how to modify that example so that I can include text in the middle of the circle?
I also ...
Hansen asked 17/5, 2013 at 18:11
4
Solved
I want to create shape like on this picture:
I created triangle shape like on this pic, and set the margins to be in top right angle, but I don't know how to make it look divided from the left d...
Symon asked 30/8, 2013 at 11:36
3
Solved
I would like to create a Vodafone logo with css like this one:
I know some people are able to draw anything with css. I can't figure out how to make the tear drop shape. This is what I have as f...
Unconditioned asked 25/3, 2014 at 11:50
1
Solved
I am trying to make polygon border shape like image below.
The code i have tried is below.
@import url('https://fonts.googleapis.com/css2?family=Poppins&display=swap');
.p-button{
backgr...
Baptistery asked 24/7, 2021 at 6:26
8
tl;dr: I would like to create an actual 3d sphere with CSS - not just an illusion
Note: some of the snippet examples are not responsive. Please use full screen.
With pure CSS you can create and an...
Despumate asked 21/7, 2017 at 12:52
4
Solved
I want to create a curve as shown in below image using css.
I was trying something like this:
.curve {
background-color: #8aa7ca;
height: 65px;
width: 160px;
-moz-border-radius-bot...
Suint asked 9/10, 2015 at 10:11
9
Solved
How can I create the following shape with CSS?
I tried this to be a solution:
.triangle:after {
position: absolute;
content: "";
width: 0;
height: 0;
margin-top: 1px;
margin-left: 2px;
...
Ameeameer asked 26/4, 2013 at 7:42
3
Is there any way to color a border corner in CSS?
I.e. : border-top-left-corner-color: red
If it can't be done in pure CSS, can it be done with some JS/jQuery trickery?
Gilliette asked 27/6, 2014 at 13:23
4
Solved
I'm using bootstrap, trying to make a div have a CSS triangle before it.
http://jsfiddle.net/B2XvZ/11/
Here is my non-working code:
.d:before {
width: 0px;
height: 0px;
border-style: solid;
...
Epiphenomenalism asked 15/12, 2013 at 0:11
14
Solved
Is there any way to make a transparent text cut out of a background effect like the one in the following image, with CSS?
It would be sad to lose all precious SEO because of images replacing text.
...
Palstave asked 18/12, 2012 at 12:24
8
Solved
Is it possible to create a circle using only HTML5 / CSS3 which has a border that only goes part way around the circle? If not, what techniques can I use to accomplish this effect? I would prefer t...
Pavlish asked 24/10, 2012 at 23:4
5
Solved
I've been testing an idea of extended/projecting borders with a few nested divs, and I have a working example below.
Basically, what I would like to achieve is vertical and horizontal borders that...
Daisy asked 20/4, 2016 at 6:38
2
I am trying to restyle Select box. Want to add a CSS arrow (looks nice when zooming the page), which would rotate as the Select box would expand, but I am not able to align the arrow properly accor...
Reiner asked 6/8, 2013 at 18:0
7
I want to be able to round out the 3 leftmost corners on this shape that I have created, any idea how that can be done?
div {
position: absolute;
z-index: 1;
width: 423px;
height: 90px...
Woolf asked 1/8, 2015 at 19:20
2
Solved
I am trying to obtain the shape using clip-path polygon property and it's not working as expected the shape I want to make is given below
I tried the following code but it is giving the corners no...
Gemmell asked 11/10, 2020 at 0:44
© 2022 - 2024 — McMap. All rights reserved.