Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Using Span tags in WordPress Navigation

  • This topic is empty.
Viewing 15 posts - 31 through 45 (of 50 total)
  • Author
    Posts
  • #91300
    tobeeornot
    Member

    Ok, success with the main-nav. The css wasn’t set to #navigation and now it is the span is fine.

    The sub-nav is still a problem, though. I’m guessing it is because the main selector contains a li and a:


    #sub-navigation li a{
    display:block;
    background-color:#647484;
    color:white; font:1.6em Verdana,Geneva,sans-serif;
    padding:10px 10px 10px 25px; position:relative;
    text-decoration:none; margin:0 0 5px 0;
    width:233px;}

    The problem is that if I change the css to match what WP is outputting here, the nav itself distorts.

    #91301
    TheDoc
    Member

    Nothing looks wrong with the sub nav CSS. Inspect inspect inspect. Look for what rules are being applied that shouldn’t, and what rules aren’t being applied that should.

    #91302
    tobeeornot
    Member

    Well, based on the code below, the span is not pointing to anything at the moment. Should it be pointing to .menu-item?




    #91304
    TheDoc
    Member

    The CSS you posted is this:

    #sub-navigation li a{
    display:block;
    background-color:#647484;
    color:white; font:1.6em Verdana,Geneva,sans-serif;
    padding:10px 10px 10px 25px; position:relative;
    text-decoration:none; margin:0 0 5px 0;
    width:233px;}

    It should have no problem accessing the HTML that you just posted.

    #91305
    tobeeornot
    Member

    I have no idea what’s wrong then…and I am not sure how the inspector can identify it either since it only matches the code that is assigned to the element inspected.

    #91306
    TheDoc
    Member

    You should inspect the anchor tag and see what styles are being applied to it.

    #91342
    tobeeornot
    Member

    @TheDoc Right, I thought I would do the right thing and learn more about Chrome Inspector before replying, and while my experiences were informative, I am still in the dark with this issue. The anchor tag is applying the styles as above and those applied to the nth:child. The nth:child styles had ul tags o them so I deleted them but no success.

    You probably can’t suggest too much but I thought I would let you know how I was getting on.

    #91343
    chrisburton
    Participant

    Can you put your menu specific html and css on jsfiddle?

    #91346
    tobeeornot
    Member

    @ChristopherBurton – I have a html test page and it is working fine recognizing the span tags. The problem seems to be that the WP nav is reading the styles slightly differently. Would a jfiddle example still be worth it?

    #91347
    chrisburton
    Participant

    @tobeeornot

    Maybe not. After @The_Doc has helped you, what seems to be the issue?

    #91348
    tobeeornot
    Member

    @ChristopherBurton – basically, I adjusted my styles to match the code that WP is outputting but it isn’t recognizing the span tags, which is strange and I am sure the css is right. I then used Chrome Inspector to try and spot any differences but without success.

    #91349
    chrisburton
    Participant

    Try giving the spans a class name and adjust your CSS accordingly.

    #91350
    tobeeornot
    Member

    Good suggestion but nope. Maybe I should upload the site to a live server? Would that be easier for people to troubleshoot?

    #91351
    chrisburton
    Participant

    Tremendously

    #92330
    tobeeornot
    Member

    This is the test. As you an see the sub nav on the left has no nubs on the background like the rest.

    This is what he tags should like in red on the left.

    Any ideas guys?

Viewing 15 posts - 31 through 45 (of 50 total)
  • You must be logged in to reply to this topic.