Re: [css-d] problem with borders

2008-02-21 Thread vwf 
On Wed, Feb 20, 2008 at 07:42:46PM +, vwf wrote:
 Hello,
 
 I try to make new layout for my website. The first hurdle is a
 horizontal navigation bar that does not behave like I want: I get
 unwanted borders, and the background does not shift on hover.
 Can someone help?

Thank you for all the replies. They will definitely help to fix all
errors. 

I am looking into the timeout error reported, but I do not know
the cause. I suspect the hardware.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] problem with borders

2008-02-20 Thread vwf 
Hello,

I try to make new layout for my website. The first hurdle is a
horizontal navigation bar that does not behave like I want: I get
unwanted borders, and the background does not shift on hover.
Can someone help?

One sketch can be seen at http://www.opeform.nl/test/schets.png
The page as I made it so far (head only): http://www.opeform.nl/test/
The CSS: http://www.opeform.nl/test/screen00.css

The navigation bar is below the image/photo.
The idea is that the lines with round pads remain (later the texts will
change). The background of the navigation bar should  change color on
hover. The red bar will change color, the same as the round pads. The
black background can have different colors too (black/white). I made the
navigation bar temporarily grey to make things more recognisable.

Some will notice that the CSS is a little bit messy, but part of that is
the result of my attempts to get it right.

My questions are: 
How can I get rid of the white borders between the navigation images?
Why do my background images no shift on hover?

Thank you
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] problem with borders

2008-02-20 Thread Karl Hardisty 
On 21/02/2008, at 8:42 AM, vwf wrote:

Hello,

I try to make new layout for my website. The first hurdle is a
horizontal navigation bar that does not behave like I want: I get
unwanted borders, and the background does not shift on hover.
Can someone help?

One sketch can be seen at http://www.opeform.nl/test/schets.png
The page as I made it so far (head only): http://www.opeform.nl/test/
The CSS: http://www.opeform.nl/test/screen00.css

The navigation bar is below the image/photo.
The idea is that the lines with round pads remain (later the texts will
change). The background of the navigation bar should  change color on
hover. The red bar will change color, the same as the round pads. The
black background can have different colors too (black/white). I made the
navigation bar temporarily grey to make things more recognisable.

Some will notice that the CSS is a little bit messy, but part of that is
the result of my attempts to get it right.

My questions are:
How can I get rid of the white borders between the navigation images?
Why do my background images no shift on hover?

Thank you
__

Unsure if it's just me, but I can't get to any of the links listed  
above - they all time out.

Regarding unwanted borders - if there are hrefed images involved,  
some browsers will add a coloured border.  Try adding the following  
to your css:

a img
{
border: 0;
}


Karl
http://mothership.co.nz
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] problem with borders

2008-02-20 Thread Kepler Gelotte 
 My questions are: 
 How can I get rid of the white borders between the navigation images?
 Why do my background images no shift on hover?



Your background didn't change on hover because you were trying to change the
background position on the anchor element which is display: inline by
default. Try setting the background on the image as in:

#navbar {
  height: 30px;
  overflow: hidden;
}


#navbar ul {
  border: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  list-style-type: none;
}

#navbar ul li {  
  border: 0;
  margin: 0;
  padding: 0;
  position: relative;
  overflow: hidden;
  display: inline;
}

#navbar ul li a:link img, #navbar ul li a:visited img {
  position: relative;
  left:-41px;
  top:-98px;
  border: 0;
  margin: 0;
  padding: 0;
  
  background-image:url(afbeeldingen/bgwig.png);
  background-repeat: no-repeat;
  background-position: -32px 37px;
  
}

/*
#navbar ul li a.first {
  background-image:url(afbeeldingen/bgwig.png);
  background-repeat: no-repeat;
  background-position: -52px 90px;
}
*/

#navbar ul li a:hover img {
  position: relative;
  left:-41px;
  top:-98px;
  border: 0;
  margin: 0;
  padding: 0;
  background-position: -52px 0px;
}

Best regards,
Kepler Gelotte
Neighbor Webmaster, Inc.
156 Normandy Dr., Piscataway, NJ 08854
www.neighborwebmaster.com
phone/fax: (732) 302-0904

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] problem with borders

2008-02-20 Thread Holly Bergevin 
From: vwf [EMAIL PROTECTED]

The page: http://www.opeform.nl/test/
The CSS: http://www.opeform.nl/test/screen00.css

My questions are: 
How can I get rid of the white borders between the navigation images?
Why do my background images no shift on hover?

The borders are white space between the LI elements. Eliminate the white 
space and you eliminate the appearance of borders.

As for the background images, I think you need to alter your hover selector 
slightly, try adding img at the end of it - 

#navbar ul li a:hover img {background-position: -52px 0px;}

That at least gives me some action. I don't know if it's what you desire, 
however.

~holly 
 
   
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/