Geek Answers Handbook

Why didn't my CSS set the div border color successfully?

I have a div on my html page that has three radio buttons in it:

 <html> <head> <link href="CSS/mystyle.css" rel="stylesheet" type="text/css" media="screen" /> </head> <body> <div id="outside"> <div id="inside"> <input type="radio"> apple <input type="radio"> orange <input type="radio"> banana </div> <div id="others"></div> </div> </body> </html>

My CSS is in the CSS directory,

CSS / mystyle.css

 #inside{ font-size:12px; border-color:#ff3366; width: 300px; height: 50px; }

width , height and font-size set successfully, but border-color:#ff3366; doesn't show why? Why I was not able to set the border color for the div?

-------------------- DETAILS ---------------------

By the way, how to find my inner div (with id = "inside") on the right side of the outer div, with a mark of about 100px to the right of the border of the outer div?

+4
source share
2 answers

You need to set border-style . Real-time example: http://jsfiddle.net/tw16/qRMuQ/

 border-color:#ff3366; border-width: 1px; /* this allows you to adjust the thickness */ border-style: solid;

It can also be written in abbreviated form:

 border: 1px solid #ff3366;

UPDATE: To move #inside to the right, you need float:right , then add margin-right: 100px . Real-time example: http://jsfiddle.net/tw16/qRMuQ/

 #outside{ overflow:auto; } #inside{ font-size:12px; border-color:#ff3366; border-width: 1px; border-style: solid; width: 300px; height: 50px; float: right; /* this will move it to the right */ margin-right: 100px; /* this applies the 100px margin from the right */ }
+19
source

The color was fine tuned, you just never added a border. Try using this:

 #inside{ font-size:12px; border-color:#ff3366; border-style: solid; border-width: 3px; width: 300px; height: 50px; }

As for your updated question, make it float:right and margin-right:100px . The only caveat: you need to add an extra div after #other only with clear:both to clear the floating div.

+1
source

More articles:


All Articles