Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • January 21, 2015 at 5:46 pm #383176
    yumanji

    Hi!!
    I’m trying to add a login form in the header area (adding a function that is called in ‘ava_after_main_menu’ event). That’s fine and i can see the code that i write.. but i’ve an issue when trying to set the right position of this login form (not to high to interfer with the ‘onOver’ event of some menu elements.. and not to low to appears outside the header area), playing with the z-index to enable the ‘onOver’ event both in the menu like in the login form.
    http://imgur.com/YDaZc8Z

    But.. when i got it.. the input fields (all the content of the ‘custom_login’ DIV) appears outside the div.. and i can’t do anything to put inside..
    (image with DIV colored by developer tools of google chrome and the login form below: http://imgur.com/6EFDJsV )
    Please.. could you help me?

    Thanks in advice… 

    </nav>
<div id="custom_login">Usuario <input type="text" size="10">Contrase&ntilde;a <input type="password" size="10"><img width="16" alt="Acceder" src="http://2015.acocex.es/wp-content/themes/enfold/images/layout/siguiente.png" />
</div>
<!-- end inner-container-->
    January 21, 2015 at 10:53 pm #383395
    Elliott

    Hi Juanjo!

    I think your wanting to do this.

    #custom_login {
  margin-top: 50px !important;
  z-index: 10 !important;
}

    If that’s not correct then go ahead and highlight in your screenshot exactly what your trying to do so we can get a better idea.

    Cheers!
    Elliott

    • This reply was modified 9 years, 10 months ago by Elliott.
    January 26, 2015 at 2:18 pm #385431
    yumanji

    Thanks Elliot, these css changes might work.
    But … I don’t understand why the input text fields (that is between the DIV tags) appears outside the DIV (the blue area in the screenshot), because i can’t see any css rule that causes it.

    Thanks in advice!

    January 27, 2015 at 8:07 am #386018
    Josue

    Hey!

    It’s the line-height that Enfold applies to the #header element, add this to reset it on your custom login div:

    #custom_login {
line-height: normal !important;
}

    Best regards,
    Josue

    January 27, 2015 at 8:07 am #386019
    Ismael

    Hey!

    It’s because of the line-height property. Try to replace the code with this:

    #custom_login {
height: 50px;
position: absolute;
color: #848383;
z-index: 200 !important;
top: 70px;
right: 0;
line-height: 0;
}

    Best regards,
    Ismael

    January 27, 2015 at 2:15 pm #386189
    yumanji

    Oh… the inherit line-height prroperty!!

    It’s fixed!

    Thanks a lot!!! (to both, Josue and Ismael)

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘DIV content is outside the DIV!’ is closed to new replies.