MVC4 Autocomplete suggestions overlapping input box

4 posts, 0 answers
  1. Rhodri
    Rhodri avatar
    2 posts
    Member since:
    May 2013

    Posted 20 Feb 2014 Link to this post

    I have an issue with Autocompletes whereby the suggestions drop-down box partially obscures the input box. This seems to only be an issue on MVC4 projects, when running the exact same code on an MVC3 project the display is fine. The attached image shows what's happening.

    I have the latest version of kendo CSS and js files referenced within the project.

    Can you let me know which part of the CSS needs to be tweaked in order to rectify this issue?

  2. Petur Subev
    Petur Subev avatar
    1882 posts

    Posted 24 Feb 2014 Link to this post

    Hello Rhodri,

    Please demonstrate your case with a small sample project since we are not aware of such overlapping issue. Thus we could run and investigate on the case.

    Kind Regards,
    Petur Subev
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Rhodri
    Rhodri avatar
    2 posts
    Member since:
    May 2013

    Posted 25 Feb 2014 in reply to Petur Subev Link to this post

    Hi, I tracked it down to this line in my CSS:

    body {
        border-top: 5px solid #53565A;

    In MVC3 the kendo autocomplete wasn't affected by this line, however in MVC4 it must assume the top of the page is 5px higher than it actually is which therefore causes the overlap.
  4. Rick
    Rick avatar
    1 posts
    Member since:
    Sep 2010

    Posted 15 Jul 2014 in reply to Rhodri Link to this post

    Thanks for the information.  I had the same issue, removing the top border cleared up the positioning issue for me as well.  You save me hours of frustration.

Back to Top