[css-d] sprites and dropdowns
Hi is there a way to use both sprites and drop down menus? I've tried this : http://test3.dekkers.net/test.htm and i can't seem to get this to work: the drop down gets the sprites background also no matter if i set background:none; to each element inside the parent LI's and when the dropdown is open - the sprite that is "selected" already "falls" to the level of the bottom inner LI in FF or just somewhere in Safari and Chrome. any help is greatly appreciated. one more - is there a way to make the dropdowns (regular ones) accessible without JS? I would like if possible that when the inner UL link is in focus ,the parent LI would have the same effect as in hover. thank you very much __ css-discuss [cs...@lists.css-discuss.org] 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] fix border on some list items?
Hello,
http://dev.bossyfrog.com/
I have a blue, horizontal nav bar on my site, the URL is above. You will see
that there are white borders that separate the items on the nav bar. They are
coded as an unordered list. The rule for the border is included in this style
info below:
.nav li {
border-right:1px solid #FF;
color:#FF;
display:inline;
font-family:Verdana,Geneva,sans-serif;
font-size:1em;
margin:0;
padding:0 10px;
}
I want the borders to be centered vertically, in line with the text-images. How
can I move those borders up so that they line up correctly?
Thanks!
Rory
--
Rory Bernstein : Web Developer
r...@rorybernstein.com
http://www.rorybernstein.com
__
css-discuss [cs...@lists.css-discuss.org]
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] fix border on some list items?
Rory Bernstein wrote:
> Hello,
>
> http://dev.bossyfrog.com/
>
> I have a blue, horizontal nav bar on my site, the URL is above. You will see
> that there are white borders that separate the items on the nav bar. They are
> coded as an unordered list. The rule for the border is included in this style
> info below:
>
> .nav li {
> border-right:1px solid #FF;
> color:#FF;
> display:inline;
> font-family:Verdana,Geneva,sans-serif;
> font-size:1em;
> margin:0;
> padding:0 10px;
> }
>
> I want the borders to be centered vertically, in line with the text-images.
> How can I move those borders up so that they line up correctly?
>
Try using the pipe character "|" rather than styling the border to
separate menu items, see if that makes a difference. You have two
validation errors related to onMouseOver and onMouseOut. Correct those,
see if they are contributing factors.
Bill B
__
css-discuss [cs...@lists.css-discuss.org]
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] fix border on some list items?
Rory Bernstein wrote: > hi Bill, > > Yes, I saw those validation errors for the mouseovers. I don't know > how to correct those... any suggestions? > > I like your suggestion about using the pipe character instead of > border. I will play with that. Thanks! > This might help. http://www.webdevelopersnotes.com/tutorials/javascript/changing_images_on_mouseover_mouseout_javascript.php3 Bill B __ css-discuss [cs...@lists.css-discuss.org] 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] fix border on some list items?
hi Bill,
Yes, I saw those validation errors for the mouseovers. I don't know how to
correct those... any suggestions?
I like your suggestion about using the pipe character instead of border. I will
play with that. Thanks!
Rory
--
Rory Bernstein : Web Developer
r...@rorybernstein.com
http://www.rorybernstein.com
On Mar 25, 2010, at 10:23 AM, Bill Braun wrote:
>
> Rory Bernstein wrote:
>> Hello,
>>
>> http://dev.bossyfrog.com/
>>
>> I have a blue, horizontal nav bar on my site, the URL is above. You will see
>> that there are white borders that separate the items on the nav bar. They
>> are coded as an unordered list. The rule for the border is included in this
>> style info below:
>>
>> .nav li {
>> border-right:1px solid #FF;
>> color:#FF;
>> display:inline;
>> font-family:Verdana,Geneva,sans-serif;
>> font-size:1em;
>> margin:0;
>> padding:0 10px;
>> }
>>
>> I want the borders to be centered vertically, in line with the text-images.
>> How can I move those borders up so that they line up correctly?
>>
>
> Try using the pipe character "|" rather than styling the border to
> separate menu items, see if that makes a difference. You have two
> validation errors related to onMouseOver and onMouseOut. Correct those,
> see if they are contributing factors.
>
> Bill B
>
>
> __
> css-discuss [cs...@lists.css-discuss.org]
> 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-discuss [cs...@lists.css-discuss.org]
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] fix border on some list items?
Hi,
give border for , not for li
a {
display: block;
border-right: 1px solid #fff;
}
because of display: block for , will get width: 100% automatically;
and you can give height for or padding, to style that, if you need.
and li don't need display: inline,
because display default value for is inline.
Kata
Rory Bernstein wrote:
> Hello,
>
> http://dev.bossyfrog.com/
>
> I have a blue, horizontal nav bar on my site, the URL is above. You will see
> that there are white borders that separate the items on the nav bar. They are
> coded as an unordered list. The rule for the border is included in this style
> info below:
>
> .nav li {
> border-right:1px solid #FF;
> color:#FF;
> display:inline;
> font-family:Verdana,Geneva,sans-serif;
> font-size:1em;
> margin:0;
> padding:0 10px;
> }
>
> I want the borders to be centered vertically, in line with the text-images.
> How can I move those borders up so that they line up correctly?
>
> Thanks!
> Rory
>
> --
>
> Rory Bernstein : Web Developer
> r...@rorybernstein.com
> http://www.rorybernstein.com
>
> __
> css-discuss [cs...@lists.css-discuss.org]
> 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-discuss [cs...@lists.css-discuss.org]
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] fix border on some list items?
Thanks so much, Kata. I will try this!
I am getting 2 of each emails from the list. Is this happening to others as
well?
Rory
--
Rory Bernstein : Web Developer
r...@rorybernstein.com
http://www.rorybernstein.com
On Mar 25, 2010, at 10:36 AM, Krupa Anna Katalin wrote:
> Hi,
>
> give border for , not for li
> a {
>display: block;
>border-right: 1px solid #fff;
> }
> because of display: block for , will get width: 100% automatically;
> and you can give height for or padding, to style that, if you need.
>
> and li don't need display: inline,
> because display default value for is inline.
>
> Kata
>
>
> Rory Bernstein wrote:
>> Hello,
>>
>> http://dev.bossyfrog.com/
>>
>> I have a blue, horizontal nav bar on my site, the URL is above. You will see
>> that there are white borders that separate the items on the nav bar. They
>> are coded as an unordered list. The rule for the border is included in this
>> style info below:
>>
>> .nav li {
>> border-right:1px solid #FF;
>> color:#FF;
>> display:inline;
>> font-family:Verdana,Geneva,sans-serif;
>> font-size:1em;
>> margin:0;
>> padding:0 10px;
>> }
>>
>> I want the borders to be centered vertically, in line with the text-images.
>> How can I move those borders up so that they line up correctly?
>>
>> Thanks!
>> Rory
>>
__
css-discuss [cs...@lists.css-discuss.org]
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] fix border on some list items?
> and li don't need display: inline, > because display default value for is inline. No it isn't! The default display for is list-item. Which is closer to block than it is to inline. If it were inline, your lists would look like: 1. Thing one 2. Thing two 3. Thing three Instead of: 1. thing one 2. thing two 3. thing three. ---Tim __ css-discuss [cs...@lists.css-discuss.org] 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] fix border on some list items?
Yes, this is true, sorry :) Kata Climis, Tim wrote: >> and li don't need display: inline, >> because display default value for is inline. >> > > No it isn't! The default display for is list-item. Which is closer to > block than it is to inline. If it were inline, your lists would look like: > > 1. Thing one 2. Thing two 3. Thing three > > Instead of: > 1. thing one > 2. thing two > 3. thing three. > > ---Tim > > __ css-discuss [cs...@lists.css-discuss.org] 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] fix border on some list items?
" and li don't need display: inline, because display default value for is inline. " His code is correct because he is turning a list into a horizontal navigation. Without setting display:inline or using floats, the items will list vertically. __ css-discuss [cs...@lists.css-discuss.org] 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] fix border on some list items?
Rory Bernstein wrote: > Thanks so much, Kata. I will try this! > > I am getting 2 of each emails from the list. Is this happening to others as > well? > > Rory > If people Reply-All the list and the OP receive a response. Bill B __ css-discuss [cs...@lists.css-discuss.org] 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] Die focus, die!
I have two questions about protocol, or whatever it might be called. 1. Is it considered "proper" to put the reply after the quote? I personally much prefer the reply first. If I'm reading a thread, I have the quote already in mind, and like it when I don't have to manually scroll down to see the reply. But if manners suggest quote first, I can do that. 2. I suppose this is a Mac Mail question. I thought one could right click on the list address in a message, choose New Message, and get a new message with a new thread. I *thought* I'd confirmed that. But lately my new threads have been grafted at the top of old threads. Sorry for that. Trial & error will have to be employed to find the true path. Chuck M __ css-discuss [cs...@lists.css-discuss.org] 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] Die focus, die!
> 1. Is it considered "proper" to put the reply after the quote? I personally > much prefer the reply first. If I'm reading a thread, I have the quote > already in mind, and like it when I don't have to manually scroll down to see > the reply. But if manners suggest quote first, I can do that. It's a list policy (although not as militantly enforced here as on some other lists) that the quoted text comes before. As I understand it, this is mostly for archive purposes. If you come in the middle of the thread, having to start at the bottom and work your way up is a little odd. Also, it facilitates inline responses to multiple questions. ---Tim __ css-discuss [cs...@lists.css-discuss.org] 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] Die focus, die!
Hi, There's an address for admin questions like that and I think it is: cs...@css-discuss.org Reply under the quote, if you remember, I often forget like in this instance. As for your mac mail question I would stop over-thinking it. I click 'new' type 'css' the address appears, tab down, give a new subject (thread) and bob's your uncle. Sometimes you may just want to reply to one part of someone's post - you can do this by highlighting that part, and then clicking reply and then only the highlighted part of that email will be seen in the reply. css-discuss = discuss css Chairs, Chris On 25/03/2010, at 11:10 PM, Charles Miller wrote: > I have two questions about protocol, or whatever it might be called. > > 1. Is it considered "proper" to put the reply after the quote? I > personally much prefer the reply first. If I'm reading a thread, I > have the quote already in mind, and like it when I don't have to > manually scroll down to see the reply. But if manners suggest quote > first, I can do that. > > 2. I suppose this is a Mac Mail question. I thought one could right > click on the list address in a message, choose New Message, and get > a new message with a new thread. I *thought* I'd confirmed that. But > lately my new threads have been grafted at the top of old threads. > Sorry for that. Trial & error will have to be employed to find the > true path. > > Chuck M > > > __ > css-discuss [cs...@lists.css-discuss.org] > 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-discuss [cs...@lists.css-discuss.org] 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] sprites and dropdowns
On 3/25/10 3:35 AM, Ido dekkers wrote: > Hi > > is there a way to use both sprites and drop down menus? > > I've tried this : > http://test3.dekkers.net/test.htm > > and i can't seem to get this to work: > the drop down gets the sprites background also no matter if i set > background:none; to each element inside the parent LI's > and when the dropdown is open - the sprite that is "selected" already > "falls" to the level of the bottom inner LI in FF or just somewhere in > Safari and Chrome. > I'm not seeing a problem this end in Safari, Firefox, or Chrome (Mac). Perhaps you could tell us what versions and platforms you use? > one more - is there a way to make the dropdowns (regular ones) accessible > without JS? > I would like if possible that when the inner UL link is in focus ,the parent > LI would have the same effect as in hover. > If you are asking whether there is a way of selecting an element from one of its children, the answer is "no." Cordially, David -- __ css-discuss [cs...@lists.css-discuss.org] 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] fix border on some list items?
On 3/25/10 6:42 AM, Rory Bernstein wrote:
> Hello,
>
> http://dev.bossyfrog.com/
>
> I have a blue, horizontal nav bar on my site, the URL is above. You
> will see that there are white borders that separate the items on the
> nav bar. They are coded as an unordered list. The rule for the border
> is included in this style info below:
>
I suggest you use floats for the LI and A elements so that the LI is the
same height as the enclosed IMG (which may be better as
'display:block;'. At the moment, the LI is specified as inline. Images
are normally inline elements that sit on the text baseline, so the
images are protruding above the LI, which currently only extends to the
height of the text. ('line-height'.) That's why the borders are so small.
Making the images block-level, and enclosing them with floated and
elements should give you what you want.
You'll need to add 'list-style-type: none;' to the UL as well - not
needed with your current design as the 'inline" does the job of
suppressing list markers.
Nice design. (But for me I'd like to be able to stop the animation...)
Cordially,
David
--
__
css-discuss [cs...@lists.css-discuss.org]
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] a:hover
_ Hotmail: Microsoft’un güçlü İSTENMEYEN POSTA koruması ile güvenilir e-posta. https://signup.live.com/signup.aspx?id=60969 __ css-discuss [cs...@lists.css-discuss.org] 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] a:hover
Hi There,
I'd like to make a:hover maroon and underlined, I tried it in the way I wrote
it below (as a part of the other css code which is correct and in a separate
style sheet, not within the mark-up of a visual studio master page) but it
doesn't work, I'd appreciate it if you have any tips...
a:hover
{color:Maroon;}
a:hover
{text-decoration: underline;}
Thanks,
Nick
_
Hotmail: Microsoft tarafından sağlanan güvenlikle, güçlü ve Ücretsiz e-posta.
https://signup.live.com/signup.aspx?id=60969
__
css-discuss [cs...@lists.css-discuss.org]
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] ADMIN: quotation patterns (was: Die focus, die!)
At 10:10 AM -0500 3/25/10, Charles Miller wrote: >1. Is it considered "proper" to put the reply after the quote? I consider it sensible to do so, as you can tell from this message, but this is not something that's enforced or even really patrolled. What IS considered deeply improper is to quote an entire message for just a few lines of response. (And if you include the list's signature file in the quoted material, that's just rude. As are lengthy legal disclaimer sigs, but never mind that now.) This holds true whether the response is at the top or the bottom. If you're trimming all the excess quoted material you can without losing too much context to frame the response, that's good enough. When I see excess quoting, I'll contact the poster off-list to ask them to keep quoted material trimmed down in the future. It isn't generally something for which I put people under moderation, or anything like that. Finally, reaching the list administrators is easy: mail css-d-ow...@lists.css-discuss.org. Now you know-- and knowing is half the battle. -- Eric A. Meyer (http://meyerweb.com/eric/), List Chaperone "CSS is much too interesting and elegant to be not taken seriously." -- Martina Kosloff (http://mako4css.com/) __ css-discuss [cs...@lists.css-discuss.org] 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] a:hover
> I'd like to make a:hover maroon and underlined, I tried it in the way I wrote
> it below but it doesn't work, I'd appreciate it if you have any tips...
>
> a:hover
> {color:Maroon;}
>
>
> a:hover
> {text-decoration: underline;}
That should do it. Or for efficiency:
a:hover {
color: maroon;
text-decoration: underline;
}
But that's got a pretty low specificity. Any rule with a class, an id, or
another tag in the selector will over-rule it, and it won't be applied.
For example:
#content a {
text-decoration: none;
}
will result in the first rule not ever being applied to any link inside the
element with id="content". That's probably your problem, but without seeing
the rest of the page, we don't know how your other CSS would be effecting
anything.
---Tim
__
css-discuss [cs...@lists.css-discuss.org]
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] Send a new message to the list (was: Die focus, die!)
On 2010-03-25 10:10 AM, Charles Miller wrote: > ...lately my new threads have been grafted at the top of old threads. So, what happens when you click on the list's email address which is the first item in every list signature at the bottom of each email? > __ > css-discuss [cs...@lists.css-discuss.org] -- Brian Funk __ css-discuss [cs...@lists.css-discuss.org] 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] Fwd: Send a new message to the list (was: Die focus, die!)
That's the other thing I need to wrap my brain around. Reply going to OP. Begin forwarded message: > On Mar 25, 2010, at 6:11 PM, Brian Funk wrote: > >> So, what happens when you click on the list's email address which is the >> first item in every list signature at the bottom of each email? > > > Nothing. It's not a link. Just text. > > But even if I'm missing something, I suggest we can "never mind" this. > Clicking New Message and typing css works. That's good enough. Guess this > thread has proven to me that a "simple little question" (or two) is more of a > distraction than I thought. Please resume your normal programming. (I should > have checked list policies; there may well be a ban on that pun.) > > Chuck M __ css-discuss [cs...@lists.css-discuss.org] 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] sprites and dropdowns
Ido dekkers asked: >one more - is there a way to make the dropdowns (regular ones) accessible >without JS? Only with mouseover ie adding the pseudoclass ":hover". Clicks means JS. __ css-discuss [cs...@lists.css-discuss.org] 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/
