'ellnav-vert' menu problem

[chipus]

Hi,

Please have a look at the attached image

i my stylesheet, i use this code to make the current active menu BOLD.

Code: Select all

.current {
      font-weight: bold;  /* Making the link of the current page bold */
      }

However, it also makes the chilren of the current active menu item BOLD too.

What should i do to solve this problem?

Please help me,

Thx a lot

[attachment deleted by admin]

[Dr.CSS]

Got Link
some times the 'parent' will give the 'child' things they shouldn't have,, you might have to tell them they can't have it,, tough love and all that  ,, whatever comes after ' .current ' could need {font-weight: ?? } normal or whatever you call it,  ?

  mark

[chipus]

hi Mark,

Could u teach me that code ?

What should i do to prevent that ?

[Dr.CSS]

look at the source,, view page, right clik, choose view page source (firefox) or view source (IE) and find the line that has your current class and see if it has any other classes or other distinct markings and use that instead.
if i could see the page it would be easier to help, are you doing it locally?

    mark

[chipus]

Code: Select all

<li class="current"><a class="current" href="http://localhost/index.php?page=product">Product</a>
<ul>
<li><a href="http://localhost/index.php?page=household_paper">Household Paper</a></li>
<li><a href="http://localhost/index.php?page=stationery">Stationery</a></li>
<li><a href="http://localhost/index.php?page=paperboard">Paperboard</a></li>
<li><a href="http://localhost/index.php?page=industrial_paper_tube">Industrial paper tube</a></li>
<li><a href="http://localhost/index.php?page=pulp">Pulp</a></li>
<li><a href="http://localhost/index.php?page=export_votive_paper">Export joss paper</a></li>
<li><a href="http://localhost/index.php?page=agricultural_and_forestal_specialities">Agricultural and forestal specialities</a></li>
<li><a href="http://localhost/index.php?page=other_services">Other services</a></li></ul>
</li>

Hi mark,

the site is currently local

Here is what i got when i try to view source. Is there anything i can put into my stylesheet to prevent the children from BOLD

Thx for your help

[Dr.CSS]

try,,

a.current {
      font-weight: bold;  /* Making the link of the current page bold */
      }

  mark

[chipus]

hi Mark,

Thx very much.

The code work for me, hi hi 

Love u so much 

[Dr.CSS]

glad i could help 

    mark

[chipus]

Hi mark,

Another problem suddently come out

I just remove this line

And my menu has problem.

Please have a look at the attachment.

The color comes out from this code

Code: Select all

    div#ellnav-vert ul ul  {
      border-right: none;
      border-top: none;
      border-bottom: 0px solid #444444;
      padding-bottom: 0px;
    }

Please help me

Thx a lot

[attachment deleted by admin]

[Dr.CSS]

you need that line,,,from,, http://www.w3schools.com/tags/tag_doctype.asp  good place to learn HTML, CSS, and other things about web pages.

HTML tag
Definition and Usage

The declaration is the very first thing in your document, before the tag. This tag tells the browser which HTML or XHTML specification the document uses.
HTML

HTML 4.01 specifies three document types: Strict, Transitional, and Frameset.
HTML Strict DTD

Use this when you want clean markup, free of presentational clutter. Use this together with Cascading Style Sheets (CSS):

HTML Transitional DTD

The Transitional DTD includes presentation attributes and elements that W3C expects to move to a style sheet. Use this when you need to use HTML's presentational features because your readers don't have browsers that support Cascading Style Sheets (CSS):

Frameset DTD

The Frameset DTD should be used for documents with frames. The Frameset DTD is equal to the Transitional DTD except for the frameset element replaces the body element:


XHTML

XHTML 1.0 specifies three XML document types: Strict, Transitional, and Frameset.
XHTML Strict DTD

Use this DTD when you want clean markup, free of presentational clutter. Use this together with Cascading Style Sheets (CSS):

XHTML Transitional DTD

Use this DTD when you need to use XHTML's presentational features because your readers don't have browsers that support Cascading Style Sheets (CSS):

XHTML Frameset DTD

Use this DTD when you want to use frames!


To check that you have written a valid XHTML document with a correct DTD,  you can link your XHTML page to an XHTML validator.

 
      mark
       

[chipus]

hi Mark,

I know about that.

But, the problem is i use somethings that can not be use when i put the DocumentType in.

I am trying to fix it now


Thx a lot

[chipus]

hi mark,

the tag

Code: Select all

.current {
background-color: ffffff;
}

it is overwrited by the background color in:

Code: Select all

div#ellnav-vert ul ul ul ul ul li a, 
    div#ellnav-vert ul ul ul ul ul li a:link, 
    div#ellnav-vert ul ul ul ul ul li a:visited  {
        padding-left: 20px;
        background-color: #999999;
    }

Could u tell me how to fix it, or any other way to fix it.

Thx a lot

[Dr.CSS]

if you don't put DOCTYPE at the top, the very top before anything else like in the default templates, browser will not know how to render the page,
as for the other, every time you make a style for something if you don't declare a style for the 'child' it will inhreit so

div#ellnav-vert ul ul ul ul ul li a.curennt a,
    div#ellnav-vert ul ul ul ul ul li a.curennt a:link,
    div#ellnav-vert ul ul ul ul ul li a.curennt a:visited  {
        padding-left: 20px;
        background-color: #FFF;
    }
hope that works, you might want to look at the rendered page source to make sure that class is there if not see if other class is and use that.

    mark

[chipus]

hi mark,

suddently i fixed that bug.

By set the border-bottom of this to none. Actually, i don't understand. Could u explain a bit for me :d

Code: Select all

    div#ellnav-vert ul ul ul  {
      border-bottom: none;
    }

Trying your code now.

Thx a lot, Mark

[chipus]

hi Mark,

the code doesn't work

Code: Select all

    
    div#ellnav-vert ul ul ul ul ul li a.current a,
    div#ellnav-vert ul ul ul ul ul li a.current a:link,
    div#ellnav-vert ul ul ul ul ul li a.current a:visited  {
        padding-left: 20px;
        background-color: #2A1F55;
    }

After trying, i think this code make the child inherit the color of it's parent.

What i want is:

the current page is RED
The parent of the current page is set by default
If the current page doesn't have children, then the parent will remain RED

The attachment is drawed by me, hihi. In this case, the child doesn't have any leaf, therefore, the Main item 2 still red, even the current page is Child 2

Glad to have u to help me

[attachment deleted by admin]