Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
This question appears to be off-topic because it lacks sufficient information to diagnose the problem. Describe your problem in more detail or include a minimal example in the question itself.
Closed 8 years ago.
Improve this question
How to draw a stuff like this in CSS?
<div style="
width: 400px;
height: 400px;
border-radius: 200px;
border: 10px solid black;
border-right: 10px solid white;
border-bottom: 10px solid white;
-webkit-transform:rotate(-45deg);
"></div>
http://jsbin.com/wedudine/1/
Related
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 2 years ago.
Improve this question
I'm currently working on a css file and I keep getting this error message. I'm new to html and coding in general, so sorry if this is a dumb question. I added a colon where the error message said I needed to but to no avail.
body {
font-family:garamond;
color:#cc4864;
background-color:#f5bdc6;
font-size:32px;
text-align:center;
h2 {
border-style: dashed;
border-width: 3px;
border-left-width: 10px;
border-right-width: 10px;
border-color: red;
}
Respect indentation, you'll find error yourself.
body {
font-family:garamond;
color:#cc4864;
background-color:#f5bdc6;
font-size:32px;
text-align:center;
}
h2 {
border-style: dashed;
border-width: 3px;
border-left-width: 10px;
border-right-width: 10px;
border-color: red;
}
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 6 years ago.
Improve this question
I want to animate border-bottom of my list-item in navbar and i don't know what property/s should i use.
The animation is like yahoo mail registration input
the trick is to use an inset shadow
input {
width: 80%;
height: 30px;
border: none;
background: transparent;
}
.shadow {
box-shadow: inset 0px -1px 0px 0px #ccc;
transition: 0.8s;
}
.shadow:focus {
box-shadow:inset 0px -3px 0px 0px #7777dd;
outline: 0;
}
<input class="shadow" type="text" placeholder="Placeholder" />
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
http://joomla.jogjafile.com/plasma/index.php
I have tried this by giving it border-bottom but I can't get that arrow shape in border?
Those triangles are often called carets. The CSS of the caret class used on that site is:
.caret {
display: inline-block;
width: 0;
height: 0;
vertical-align: top;
border-top: 4px solid #000;
border-right: 4px solid transparent;
border-left: 4px solid transparent;
content: "";
}
However, they are overriding the display with other CSS but this should help you get the caret. More information on creating triangles/carets in CSS can be found Here.
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking for code must demonstrate a minimal understanding of the problem being solved. Include attempted solutions, why they didn't work, and the expected results. See also: Stack Overflow question checklist
Closed 9 years ago.
Improve this question
I want to create a title with a background like this:
But there is a problem, as you can see in the picture, there are 3 different backgrounds:
The first one is for the whole page
second one is just a circle
third is a black line.
I want to create this title but i have problems with backgrounds.
I've tried including Span tag into title h3 ... didn't work.
what should I do?
P.S: I want to make this background for all titles backgrounds, so I don't want to create just one background for one title, I want it to be responsive and look good on any title.
the markup
<h3>Meet the Team</h3>
the style
h3{
width:320px;
height:40px;
text-align:left;
background:black;
color:red;
padding:10px;
line-height:40px;
position:relative;
}
h3:before,h3:after{
position:absolute;
content:'';
}
h3:before{
width: 20px;
height: 20px;
border-radius: 100%;
background: #2C2C2C;
right: 174px;
top: 20px;
box-shadow: inset -2px -1px #3F3D3D;
}
h3:after{
width:160px;
height:4px;
background:red;
background: #2C2C2C;
right: 14px;
top: 28px;
box-shadow: inset -2px -1px #3F3D3D;
}
Demo:http://jsfiddle.net/9U8NQ/
Closed. This question is off-topic. It is not currently accepting answers.
Want to improve this question? Update the question so it's on-topic for Stack Overflow.
Closed 10 years ago.
Improve this question
Can I ask how to change the css of my theme to make the page looks like this http://katiefreiling.com/ this site has its navigation which is purple not extended until the left and right corner. My navigition seems to be extended from left and right corner and my content and footer too. Is it possible to have a style or format similar to the link above? Thanks in advance this is my website http://michelebrunello.com/.
It is better to learn the concepts first and then ask questions. I don't know what picture is in your mid exactly but as per your demo website given i have added few css rules in your css please see the below css rules and try to add in your css.
line 35 white.css
#topmenu {
background: none repeat scroll 0 0 #212983;
border-color: #FFFFFF;
border-style: solid;
border-width: 1px 0;
margin-left: auto;
margin-right: auto;
width: 940px; }
line 11 white.css
#footer-widgets {
background-color: #FAFAFA;
border-top: 1px solid #E6E6E6;
margin-left: auto;
margin-right: auto;
width: 960px; }
line 901 style.css
#footer {
background: url("images/bgr-box-trans.png") repeat-x scroll 0 0 #E4E2DB;
border-top: 1px solid #EEECE6;
font-size: 11px;
height: 32px;
line-height: 22px;
margin-left: auto;
margin-right: auto;
padding: 20px 0; }
Try to implement the css first.