Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 1 year ago.
Improve this question
I would like to create something like representing in the picture. I've tried different methods but none is delivering my expectation. I'm not sure how, does anyone have any idea how it should be done? https://i.stack.imgur.com/lrb7f.png
You can use border-top-left-radius and
border-bottom-left-radius:
div {
height: 200px;
width: 600px;
border-top-left-radius: 100px;
border-bottom-left-radius: 100px;
background: black;
}
<div></div>
Related
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 2 years ago.
Improve this question
I'm looking for some techlogy that I can make an effect at the bottom of <input> element when I hover on it. Like this:
If I understand correctly, you're looking for box-shadow property. Like this:
input {
width: 280px;
height: 20px;
border: 3px inset;
}
input:hover {
box-shadow: 0 2px cyan;
}
<input type="text">
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 2 years ago.
Improve this question
The Anchor I'm referring to is above
I understand how to create an with rounded corners with border-raidus, however not like the anchor above.
You'll have to use border-radius.
But the catch is not to use percentages but use half the height of the element in px or another unit like em or rem.
Here's some example code that could help you.
.anchor {
width: 120px;
height: 50px;
border-radius: 25px;
background: red;
color: white;
display: flex;
align-items: center;
justify-content: center;
}
<div class="anchor">Contact</div>
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 7 years ago.
Improve this question
I have the following CSS:
#Wrapper {
width: 600px;
background: #FFFFFF;
margin: 0 auto;
padding: 5px;
border-radius: 10px;
}
And the following HTML:
<div id="Wrapper">
...
</div>
But for some reason the wrapper's CSS styling does not extend the full length of the HTML.
I'm missing something obvious I'm sure but can't see the wood for the trees right now and pasting all the code would just make my post look a mess.
Any thoughts...?
Use tables for emails to be consistent across all clients.
Then you should read up on CSS use within emails.
margins, border-radius are not acceptable.
http://www.campaignmonitor.com/css/
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 7 years ago.
Improve this question
See this CSS-based visualization for graphs. Any idea what is the easiest way to add directions to edges (e.g. arrows on edges)?
Wrap your <li> contents with <span> tags and style the pseudo elements to achieve a proper result. You may not use ASCII characters, backgounds or even pure CSS triangles.
http://jsfiddle.net/ndozdw00/1/
.tree li span:after{
content: "▼";
position: absolute;
left: 50%;
width: 10px;
margin-left: -5px;
top: 10px;
z-index: 100;
}
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
Good day!
I am trying to make a widget, my code is as follows: http://jsfiddle.net/SeWCg/
The problem is that there is a white space between the inner and the outer rounded border.
How can i resolve this?
change
.widget1{
width: 218px;
height: 210px;
background-color: white;
}
to
.widget1{
width: 218px;
height: 210px;
}