[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"\u002Farticles\u002Fthe-false-bottom-effect":3},{"id":4,"title":5,"body":6,"date":58,"description":59,"extension":60,"head":61,"imageUrl":28,"meta":62,"navigation":63,"ogImage":61,"path":64,"robots":61,"schemaOrg":61,"seo":65,"sitemap":66,"stem":67,"__hash__":68},"articles\u002Farticles\u002F27.The-false-bottom-effect.md","The false bottom effect",{"type":7,"value":8,"toc":55},"minimark",[9,13,17,20,23,36,45],[10,11,5],"h1",{"id":12},"the-false-bottom-effect",[14,15,16],"p",{},"There is a known UX issue called the false bottom effect.",[14,18,19],{},"It happens when a dropdown's visible height exactly matches the visible items, so users assume there is nothing more below.",[14,21,22],{},"On macOS this becomes worse because scrollbars may stay hidden until hover.",[24,25,29],"v-image",{":hasBorder":26,":rounded":26,"alt":27,"src":28},"true","False bottom bad example","\u002Fimg\u002Ffalse-bottom-effect\u002Ffalse-bottom-bad.png",[30,31,33],"template",{"v-slot:description":32},"",[14,34,35],{},"No visible clue that dropdown has more items",[24,37,40],{":hasBorder":26,":rounded":26,"alt":38,"src":39},"False bottom improved example","\u002Fimg\u002Ffalse-bottom-effect\u002Ffalse-bottom-good.png",[30,41,42],{"v-slot:description":32},[14,43,44],{},"A partially visible next item hints that content continues",[14,46,47,48],{},"Source: ",[49,50,54],"a",{"href":51,"rel":52},"https:\u002F\u002Fcxl.com\u002Fblog\u002Ffalse-bottom\u002F",[53],"nofollow","CXL article on false bottom effect",{"title":32,"searchDepth":56,"depth":56,"links":57},2,[],"2026-03-04T10:00:00+04:00","A subtle dropdown usability issue: when visible items perfectly fill container height, users may miss that the list is scrollable.\n","md",null,{},true,"\u002Farticles\u002Fthe-false-bottom-effect",{"title":5,"description":59},{"loc":64},"articles\u002F27.The-false-bottom-effect","Ol94Zpn-L_p6_2SFd40seL7aR7QPzFoxNmcoQxm-DhY"]