Re: [css-d] ul li unordered lists list level indent control

[Barrett]

On Jul 6, 2008, at 9:06 PM, David Laakso wrote:
>
> "When in Rome, do as the Romans do."
> Do you have a CSS question?
>
> -- 
> http://chelseacreekstudio.com/
>


Jen got it answered.

Thanks,
Barrett
AOL/AIM handmadepaperus

__
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] ul li unordered lists list level indent control

[David Laakso]

Barrett wrote:
> On Jul 6, 2008, at 5:27 PM, David Laakso wrote:
>   
>> I may be "out-to-lunch" and totally missing the point?
>>
>> The second list is an invalid construct.
>> --  
>> http://chelseacreekstudio.com/
>>
>> 
>
> Who know's maybe there  
> is a mivascript smt code lurker on here.
> Barrett
>
>   


"When in Rome, do as the Romans do."
Do you have a CSS question?

-- 
http://chelseacreekstudio.com/

__
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] ul li unordered lists list level indent control

[Barrett]

On Jul 6, 2008, at 5:27 PM, David Laakso wrote:
>
> I may be "out-to-lunch" and totally missing the point?
>
> The second list is an invalid construct.
> --  
> http://chelseacreekstudio.com/
>


Just to let ya know where I'm literally coming from sometimes with  
this stuff; here is the code involved with generating the output  
involved with the  and css in this case. Who know's maybe there  
is a mivascript smt code lurker on here. I do have a forum post going  
in the miva script community but not some many css pro and purist are  
there like here I think.

Enjoy my code.







►&mvt:tree:name;







&mvt:tree:name;







Thanks,
Barrett
AOL/AIM handmadepaperus

__
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] dropdown menu in firefox is jumping/ jittery

[Christian Heilmann]

Cathy Tibbles wrote:
> I have read about this before, but I can't for the life of me, find the
> source.  The drop down menu works well, but when moving from a LI to a
> LI:hover, it gets jittery.  I'm not using any background images either. 
>
> If this is helpful, the code is pasted here: http://pastebin.com/m152e037e
> Working example (although not aligned properly in IE) is
> http://www.tibbles.net/designs/blog 
>
> Thank you so much!
>   
Have you tested this with other people? I am very confused by the menu. 
A menu is there to guide users to other information, not to randomly 
cover other parts of the main navigation items and work only with a 
mouse.  Click handling or at least relative positioning with shifting of 
the rest of the menu would make things a lot clearer.

As to your problem, my guess is that the absolute positioning is causing 
a pixel gap between active LI and next LI. Try a padding on the parent 
LI and position the child LI with a negative margin to create an overlap.

__
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] dropdown menu in firefox is jumping/ jittery

[Cathy Tibbles]

I have read about this before, but I can't for the life of me, find the
source.  The drop down menu works well, but when moving from a LI to a
LI:hover, it gets jittery.  I'm not using any background images either. 

If this is helpful, the code is pasted here: http://pastebin.com/m152e037e
Working example (although not aligned properly in IE) is
http://www.tibbles.net/designs/blog 

Thank you so much!


Cathy Tibbles
Mommy Motivation
Strawberries are Gluten Free.Com



__
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] ul li unordered lists list level indent control

[Barrett]

On Jul 6, 2008, at 5:25 PM, Jens Nedal wrote:
>>
>>
> When for example a Screenreader tries reading that list, the  
> information
> about levels is lost, in contrary to actually nesting the ul elements.
> Semantically all you have is list with one level, nothing else.
>
> In terms of have a structure that already conveys meaning without
> styling i would regard this as bad practice.
>
> regards, Jens
>

I had a feeling it was something like that.
If you only knew what the backside looks like to make it happen  
correctlyI'm working on it though.

Thanks,
Barrett
AOL/AIM handmadepaperus

__
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] ul li unordered lists list level indent control

[David Laakso]

Barrett wrote:
> What do you think about controlling a  list levels as seen by the  
> enduser in browser with css padding ?
> I just contemplated this while wrangling with some server side code  
> that builds a list dynamically based on how many records it  sees and  
> whether they are parent or children
>   


I may be "out-to-lunch" and totally missing the point?

In the first list:

.secondlevel {padding-left: 2em;}
stuff

is not needed.

It might simply be 
li {padding-left: 2em;}
stuff


The second list is an invalid construct.


-- 
http://chelseacreekstudio.com/

__
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] ul li unordered lists list level indent control

[Jens Nedal]

Barrett wrote:
> What do you think about controlling a  list levels as seen by the  
> enduser in browser with css padding ?
> I just contemplated this while wrangling with some server side code  
> that builds a list dynamically based on how many records it  sees and  
> whether they are parent or children
> 
> .firstlevel {padding-left: 1em;}
> 
> .secondlevel {padding-left: 2em;}
> 
> 
> Like this:
> 
> 
>   Parent One
>   
>   
>   
>   
>   
>   
>   
>   Parent Two
>   
>   
>   
>   
>   
>   
> 
> 
> 
When for example a Screenreader tries reading that list, the information 
about levels is lost, in contrary to actually nesting the ul elements. 
Semantically all you have is list with one level, nothing else.

In terms of have a structure that already conveys meaning without 
styling i would regard this as bad practice.

regards, Jens
__
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] ul li unordered lists list level indent control

[Barrett]

What do you think about controlling a  list levels as seen by the  
enduser in browser with css padding ?
I just contemplated this while wrangling with some server side code  
that builds a list dynamically based on how many records it  sees and  
whether they are parent or children

.firstlevel {padding-left: 1em;}

.secondlevel {padding-left: 2em;}


Like this:


Parent One







Parent Two









Instead of this:


Parent One










Lokta Paper









Thanks,
Barrett
AOL/AIM handmadepaperus

__
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] CSS Help: Changing Tab color on selected page?

[Alan K Baker]

BTW. You also have several instances of the same typo in your CSS.

They read: background-color:ooaeef instead of 00aeef.

Regards, 
 
Alan.
 
www.theatreorgans.co.uk
www.virtualtheatreorgans.com
Admin: ConnArtistes, UKShopsmiths, 2nd Touch & A-P groups
Shopsmith 520 + bits
Flatulus Antiquitus


  - Original Message - 
  From: David Laakso 
  To: Heidi Hackler 
  Cc: Erik Fadiman ; css-d@lists.css-discuss.org 
  Sent: Sunday, July 06, 2008 5:57 PM
  Subject: Re: [css-d] CSS Help: Changing Tab color on selected page?


  Heidi Hackler wrote:
  > I would like  
  > the tab color on the page you are ON (selected page) to be a  
  > different color...
__
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] CSS Help: Changing Tab color on selected page?

[David Laakso]

Heidi Hackler wrote:
> I would like  
> the tab color on the page you are ON (selected page) to be a  
> different color.


> However, while the tab color change does show up in Dreamweaver, it does not  
> show up when I preview in IE7 or Firefox. What gives??
> Please see web site here:  sp_site_review/index.html>
>   


You can't trust any editor's viewer-- they are not browsers.

> and then see this JPG file of how I would "LIKE" it to look here:  
>  SmartPlug_home_page.jpg>
>
>
> -- Heidi 
>
>   



html
Home
css
.orangetabs li a, b {...}
b {background:lime/*some  background-color*/; color:#fff;}   

Best,
E. Delacroix


-- 
http://chelseacreekstudio.com/

__
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] graphic placement

[Christian Kirchhoff privat]

Hello,

in order to position the eye graphic at the top of the screen use

#logo {
  left: 0;
  position: absolute;
  top: 0;
}
 You didn't mention the horizontal position you'd like to achieve, but you
can always alter the value for left to fit your needs.

I didn't understand the curve graphic thing. "appear at margin 200px to the
right margin of an 800 by 600 pixel screen". So the right edge of the
graphic should sit at 600px (800px screen width minus 200px)? Well, the
image is 850 pixels wide. Thus the left edge would have to sit at -250px in
order to let the right edge be at 600px. So the vaslue for
background-position would have to be -250px. But I doubt that that is what
you want...

Not sure what you mean by "Firefox and IE7 display the Guide Star graphic an
text differently". In order to get rid of the border yround the graphic you
have to select the img inside the anchor like this:

#logo2 img {
  border: none;
}

Hope that helps, best regards,

Christian

> -Original Message-
> From: [EMAIL PROTECTED] 
> [mailto:[EMAIL PROTECTED] On Behalf Of 
> Hayden's Harness Attachment
> Sent: Sunday, July 06, 2008 2:07 AM
> To: CSS-D
> Subject: [css-d] graphic placement
> 
> 
> I am doing some work with the file 
> http://www.choroideremia.org/new/crf_header.php which 
> contains both the HTML code and CSS. I am trying to figure 
> out how to get my eye graphic align with the top of the 
> screen and get the curve graphic appear at margin 200px to 
> the right margin of an 800 by 600 pixel screen. Any help welcome?
> 
> Also, why does Firefox and IE7 display the Guide Star graphic 
> an text differently? I would like to get the Guide Star 
> graphic and text looking the same in Firefox as IE and align 
> with the bottom left corner of my curve graphic. Help please.
> 
> Angus MacKinnon
> Infoforce Services
> http://www.infoforce-services.com
> 
> "Faith is the strength by which a shattered world shall 
> emerge into the light." - Helen Keller
> 
> __
> 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-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] Centering content - new user

[Chris Akins]

Good Morning,

It appears from your code that you're wanting the div26 to act as a wrapper
of sorts to hold and surround everything else.  If that's the case, then
that div really needs to surround everything in the HTML too.  The opening
div26 tag will start the page content, then all your header, navigation,
etc. goes in - probably using one of the approaches Mr. Laakso suggests,
then the closing div26 tag ends the content block.  This div26, when
centered using something like {margin:0 auto;} with a defined width will
then stay in the horizontal center of the page, taking all its interior
contents with it provided those individual content areas are not all
absolutely positioned.

One other note that you will find quite helpful I think is just a suggestion
to start a naming convention for your coding so that it's easy to edit your
pages.  I think you'll find that anyone trying to read and edit your code,
including yourself, will quickly go crazy trying to decipher div's that are
only named as arbitrary numbers, and other elements such as images that
aren't named for their function.  Before your site gets out of hand it would
be time well spent to start naming your divs for things that have meaning -
header, content, rightCol, leftCol, etc.  rather than div1, div2.  You'll
save yourself a ton of grief later by adopting best practices from the
foundation of your pages.

Good luck with the site.

Chris A.

On Sat, Jul 5, 2008 at 9:29 PM, Brian Gilbert <
[EMAIL PROTECTED]> wrote:

> Hi,
>
> I'm brand new to using CSS and could use some assistance.  What I am
> wanting
> to achieve is for the content of my webpage to stay centred with a drop
> shadow while the stretches when the browser window size is increased
> similar
> to http://www.macworld.com.au/.
>
> I'm creating a website at the moment and have put the rough pages up on
> http://www.nctd.com.au/
>
> You will see on the index page that the "apDiv26" displays about 10 pixels
> down from the top of the page even though I have set it to be 0 pixels in
> all of the settings that seem relevant.  I've tried using Absolute and
> Relative settings to "apDiv26" but it does not function in the way that I
> am
> looking for.  Any input appreciated to put me on the right track.
>
> Thanks,
> Brian Gilbert
> Perth Western Australia
>
>
> __
> 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-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] Centering content - new user

[David Laakso]

Brian Gilbert wrote:
> 'm brand new to using CSS and could use some assistance.  What I am wanting
> to achieve is for the content of my webpage to stay centred with a drop
> shadow while the stretches when the browser window size is increased similar
> to http://www.macworld.com.au/.
>
> I'm creating a website at the moment and have put the rough pages up on
> http://www.nctd.com.au/
>
> You will see on the index page that the "apDiv26" displays about 10 pixels
> down from the top of the page even though I have set it to be 0 pixels in
> all of the settings that seem relevant.  I've tried using Absolute and
> Relative settings to "apDiv26" but it does not function in the way that I am
> looking for.  Any input appreciated to put me on the right track.
>
> Thanks,
> Brian Gilbert
> Perth Western Australia
>
>   


Welcome to the list.

I guess the space at the top is browser margin or padding, and
html, body {margin:0; padding:0;}
should kill it.

The difficulty with centering it horizontally is you've got it 
positioned absolutely (it ain't gonna move) off- the left rail, and then 
positioned what is inside the page absolutely off that point.. 
Consequently, the whole works is locked.

A float positioning structure for the layout will work much better for 
you than absolute positioning (ap).  Reserve ap for positioning little 
things within a float base.  Your current  layout really requires no ap 
at all.

Thi/m/k of the  page as a box into which you put smaller boxes-- some 
boxes go left (float:left); others go right (float:left;), and some just 
sit there,  going neither left or right. Keep the code (CSS) lean, using 
only what is needed to do the job. So, in a sense, you're making a box 
with nested boxes inside of it. And putting that box in a lean and /fast 
car/.

The usual way of centering the outer box (page) is described here [1].

Perhaps this example will help explain things better than me [2}

As ever,
Tracy
"Me myself I got nothin' to prove..."
/Fast Car/

[1] 
[2] 











-- 
http://chelseacreekstudio.com/

__
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/