Using border: border: 1px solid Need some help.

Forum Moderators: not2easy

Message Too Old, No Replies

Using border: border: 1px solid Need some help.

border: 1px solid. Can it be set to 0 or is it none?

frenzy77

11:09 am on Apr 13, 2006 (gmt 0)

Hey guys:)

I'm setting up a CSS *navigation menu*.

I'm using: display: block;

I used:

border: 1.5px solid;

on a site before, but i wanted to set it up for the border to have 1.5px on the *top* and 1.5px on the *bottom*. Also the left and right i would like to be set to 0.

Q.1. Is it set to 0 (zero) or is it "none"?
Like this:

border-top: 0px;

border-top: none;

-----------

*Also if i set it up as:

border-top: 1.5px solid;
border-right: 0px;
border-bottom: 1.5px solid;
border-left: 0px;

Q.2. Will it display it as 1.5px on the top and bottom with the left and right as 0px?

I ask these questions because i can't find anything about using px for values. I read that your suposed to use *thin* with the #color number. I've used px before but not sure if it's set with 0 or none.

Thanks guys for your help:)

Hope to hear from you soon:)

frenzy77

deliriumtremens

11:33 am on Apr 13, 2006 (gmt 0)

Either none or 0 would be correct, but you can also do it as:

border: 1.5px 0px solid;

When you have only two values in 'border', the first value is for the top and bottom, the second for the left and right.

frenzy77

11:44 am on Apr 13, 2006 (gmt 0)

Hey deliriumtremens:)

Thanks for the help:)

Just to make sure i understand correctly, i can set it up like this:

border-top: 1.5px solid;
border-right: 0px;
border-bottom: 1.5px solid;
border-left: 0px;

and it will display as coded above?

Thanks again deliriumtremens:)

I appreciate your response.

frenzy77

moltar

12:10 pm on Apr 13, 2006 (gmt 0)

0px: the border is still there, it's just 0px thick.
none: no border is present

Here is an example to support this. You see, in the first example, I set the border to red, then set it to 0 thin, and then set it back to 1px. The border is present.

In the second example, I set the border to green, then set it to none, then set it to 1px, and the border is gone.

So I say there is no "right" answer. It depends what you want to do.

<?xml version="1.0" encoding="iso-8859-1"?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
  
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> 
<head> 
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> 
  
<title>Border Test</title> 
  
<style type="text/css" media="screen">  
div { 
padding: 10px; 
margin: 10px; 
} 
div.border-0 { 
border: 1px solid red; 
border-width: 0; 
border-width: 1px; 
} 
div.border-none { 
border: 1px solid green; 
border: none; 
border-width: 1px; 
} 
</style> 
</head> 
  
<body> 
  
<div class="border-0"></div> 
<div class="border-none"></div> 
  
</body> 
</html>

deliriumtremens

6:30 am on Apr 14, 2006 (gmt 0)

np frenzy77, and yes, setting it up this way:

border-top: 1.5px solid;
border-right: 0px;
border-bottom: 1.5px solid;
border-left: 0px;

will work, I just prefer to keep the code slim and trim where possible.

frenzy77

11:45 am on Apr 18, 2006 (gmt 0)

Hey fellas:)

Thanks for all your input:)

I appreciate your time spent in reading and answering.
Thanks again guys:)

frenzy77