Current menu color and footer margin

(19 posts) (2 voices)

1. 

   VivalaMedia
   Member

   Hello,

   Since the last time i have added icons to my menu. http://temp.vivalamedia.nl/ the thing is that when you visit a page it doesn't highlight anymore cause i removed the hover option. Is there another way to keep the page highlighted the same way it looks when you hover over it?

   second question is about my footer. It doesn't completely touch the bottom of the page so it shows some of the wallpaper through it on some pages. Is there a way to get it to stick to the bottom of the page?

   Thanks in advance
   Robin,

   Posted 3 months ago #
2. 

   Elliott
   Support

   Hello VivalaMedia,

   You can target the active menu item like so,

   .current_page_item a { }

   As for the image in the bottom it looks like you have some typos in it's styling. Paste the code your using here.

   Posted 3 months ago #
3. 

   VivalaMedia
   Member

   Do you think it's in the css or in the footer.php?

   this is the php:

   <?php
   /**
   * Footer Template
   *
   * @package Mysitemyway
   * @subpackage Template
   */
   ?>

   <?php mysite_after_main();

   ?><div class="clearboth"></div>

   </div><!-- #content_inner -->
   </div><!-- #content -->

   <?php mysite_before_footer();

   ?><div id="footer">
   <div class="multibg">
   <div class="multibg"></div>
   </div>
   <div id="footer_inner">
   <?php mysite_footer();

   ?></div><!-- #footer_inner -->
   <?php mysite_after_footer_inner();
   ?></div><!-- #footer -->

   <?php

   $image = "http://temp.vivalamedia.nl/wp-content/uploads/2012/01/footer2.png";

   Echo "<img src=".$image." Style=width:auto;height:auto;margin-left:-264px; margin-right:auto;margin-top:-200px;>"

   ?></div><!-- #body_inner -->
   <?php wp_footer(); ?>
   <?php mysite_body_end(); ?>

   this is the css:
   #outro{line-height:25px;letter-spacing:1px;margin:0 auto;overflow:hidden;width:880px;text-shadow:1px 1px 1px #fff;}
   #outro p{margin-bottom:0;}
   #outro_inner{margin:25px auto;padding:0;}
   #footer{ margin:0 auto;letter-spacing:.6px;width:800px;}
   #footer_inner{padding:40px 0;overflow:hidden;}
   #sub_footer{margin:0 auto;}
   #sub_footer_inner{width:880px;margin:2px 10px;width:880px;}
   #sub_footer a:hover{text-decoration:none;}

   .footer_links{float:right;padding-top:5px;}
   .footer_links li{float:left;padding-right:12px;}
   .footer_links ul{list-style:none;padding:0;margin:0;}
   .footer_links ul ul{float:right;margin-right:0px;}
   .no_footer #footer{height:0px;}

   Posted 3 months ago #
4. 

   VivalaMedia
   Member

   
   

   Posted 3 months ago #
5. 

   Elliott
   Support

   This part here,

   Echo "<img src=".$image." Style=width:auto;height:auto;margin-left:-264px; margin-right:auto;margin-top:-200px;>"

   Should look like this,

   echo "<img src='".$image."' style='width:auto;height:auto;margin-left:-264px; margin-right:auto;margin-top:-200px;'>";

   Posted 3 months ago #
6. 

   VivalaMedia
   Member

   i encountered some problems regarding this issue, i found the .current_page_item a { } code but it doens't have any effect if i modify it. I think it is because i altered this line of code:

   .jqueryslidemenu>ul>li>a:hover ,.jqueryslidemenu>ul> /* li:hover>a */ {background:url(images/menu_hover2.png) no-repeat center -4px;}

   (i put the hover on inactive because it didn't show the icons when i hovered over the menu item) I think these are related, am i right?

   I tried adding a .current_page_item a { font-color:#9f9f9f; } but it did not do the trick yet

   Futhermore, when i change the code of the footer it makes the gap between the bottom of the page and the content ever bigger, i don't know how this is possible.

   Thanks in advance,
   with kind regards,
   Robin

   Posted 3 months ago #
7. 

   Elliott
   Support

   I don't see it on your page. Make sure your adding it in the custom CSS section and use the !important rule like so,

   .current_page_item a { color: #9f9f9f !important; }

   Posted 3 months ago #
8. 

   VivalaMedia
   Member

   I have added the !important; part and it is in my custom css. but it doesn't change anything. I have turned of the other highlight options (i put the li: hover on inactive) i don't know if this is interfering with anything but i don't think the .current_page_item a does anything at the moment

   Posted 3 months ago #
9. 

   Elliott
   Support

   Paste the full contents of your custom CSS field here.

   Posted 3 months ago #
10. 

    VivalaMedia
    Member

    [Moderated]

    Posted 3 months ago #
11. 

    Elliott
    Support

    I said your custom CSS field, not your stylesheet. Please slow down and read my posts.

    Posted 3 months ago #
12. 

    VivalaMedia
    Member

    I'm sorry, i thought that was what you ment. Do you mean only the parts within the stylesheet i have edited? Cause i have not made another css file, just edited the one provided with the website.

    Posted 3 months ago #
13. 

    Elliott
    Support

    In your previous post you said you placed it in the custom CSS. Go ahead and upload a fresh copy of the theme and do your customizations in Dashboard -> your theme -> General Settings -> Custom CSS.

    Posted 3 months ago #
14. 

    VivalaMedia
    Member

    Oh yeah i found it. Silly me, I did not know that you could also do it there. So i have to copy all the pieces of altered code in a document, upload a fresh copy of the theme and paste the css i had already altered in the custom css field?

    Is that the reason why the selected menu item won't hightlight? cause apart from that everything is working perfectly

    Sincerely,
    Robin

    Posted 3 months ago #
15. 

    Elliott
    Support

    Send us a private message by clicking on the "PM this user" link beneath our usernames.

    Posted 3 months ago #
16. 

    VivalaMedia
    Member

    The site is done apart from a small problem,

    the footer still isn't doing what i want. It has a margin of approximately 4-5 pixels, no matter how long the page is, it always has this margin. I tried replacing:

    Echo "<img src=".$image." Style=width:auto;height:auto;margin-left:-264px; margin-right:auto;margin-top:-200px;>"

    with

    echo "<img src='".$image."' style='width:auto;height:auto;margin-left:-264px; margin-right:auto;margin-top:-200px;'>";

    But it didn't help, it only made it bigger. Is there a way to remove the margin at the bottom of the page?
    This is the site: http://temp.vivalamedia.nl/

    sincerely,
    Robin

    Posted 3 months ago #
17. 

    Elliott
    Support

    The HTML looks kind of weird on your page. You need to close the image like this,

    <img src = "" />

    Try setting it's position to relative and use the left / top values instead of margins.

    Posted 3 months ago #
18. 

    VivalaMedia
    Member

    if i do this

    Echo "<img src=".$image." Style=width:auto;height:auto;margin-left:-264px; position:relative; margin-right:auto;margin-top:-200px;"/>

    i get this error

    Parse error: syntax error, unexpected '>' in /home/customers/nfs/v/vivalamedia.nl/html/temp.vivalamedia.nl/wp-content/themes/awake/footer.php on line 37

    I've tried a lot of things but i'm out of ideas how to fix this issue

    SIncerely,
    Robin

    Posted 3 months ago #
19. 

    Elliott
    Support

    Your first code was correct,

    echo "<img src='".$image."' style='width:auto;height:auto;margin-left:-264px; margin-right:auto;margin-top:-200px;'>";

    It just needs an ending slash like so,

    echo "<img src='".$image."' style='position:relative; left:-264px; top:-200px;' />";

    Posted 3 months ago #

RSS feed for this topic

Reply

You must log in to post.