CSS Border Not Working

CssBorder

Css Problem Overview


I've been trying to get a border on either side of my white container. It's just not showing. I've tried to put it in three different elements just in case! (see below). Any ideas on how to make it work?

#wrapper {
	width:1000px;
	background:#F4F4F4;
	padding-top:5px;
	border: 3px #CDCDCD;
	overflow: auto;
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto;  
}

#casing {
	padding:0px 0px 0px 0px;
	background:#Fff;
	border: 0 1px 0 1px solid #000;
}	

#cover {
	border: 0 1px 0 1px solid #000;
}	

Css Solutions


Solution 1 - Css

Do this:

border: solid #000;
border-width: 0 1px;

Live demo: http://jsfiddle.net/aFzKy/

Solution 2 - Css

I think you've just made up shorthand syntax for the border: property there =)

Try simply:

border-right: 1px solid #000;
border-left: 1px solid #000;

Solution 3 - Css

Use this line of code in your css

border: 1px solid #000 !important;

or if you want border only in left and right side of container then use:

border-right: 1px solid #000 !important;
border-left: 1px solid #000 !important;

Solution 4 - Css

Have you tried using Firebug to inspect the rendered HTML, and to see exactly what css is being applied to the various elements? That should pick up css errors like the ones mentioned above, and you can see what styles are being inherited and from where - it is an invaluable too in any css debugging.

Solution 5 - Css

AFAIK, there's no such shorthand for border. You have to define each border separately:

border: 0 solid #000;
border-left: 1px solid #000;
border-right: 1px solid #000;

Solution 6 - Css

The height is a 100% unsure, try putting display: block; or display: inline-block;

Solution 7 - Css

You forget to add Border style, Do this

border-style: solid

Or you can write

border: 3px #CDCDCD solid

Solution 8 - Css

In latest version, i just experienced to get a border you have to first set the border-style. Then, the rest border width or color is considered.

border-style: solid;
border-width: 2px;
border:blueviolet;

Solution 9 - Css

Check if somewhere in a code you are not using this style:

border-top: none;

Or any other variation of border-{side}: none.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionTaraView Question on Stackoverflow
Solution 1 - CssŠime VidasView Answer on Stackoverflow
Solution 2 - CssRudi VisserView Answer on Stackoverflow
Solution 3 - CssAnil SinghaniaView Answer on Stackoverflow
Solution 4 - CssKen RayView Answer on Stackoverflow
Solution 5 - CssTatu UlmanenView Answer on Stackoverflow
Solution 6 - CssDanView Answer on Stackoverflow
Solution 7 - Csspriya janiView Answer on Stackoverflow
Solution 8 - CssAman FangeriaView Answer on Stackoverflow
Solution 9 - CssCo tiView Answer on Stackoverflow