Нужно чтобы в начале отображался первый блок с text1. Как будто уже навели на item1. Уже после как навели на другой item показывать соответствующий им блок.
.menu {
position: relative;
list-style: none;
margin: 0;
padding: 0;
}
.menu__item {
width: 30%;
padding: 20px;
background: #60a3bc;
border-bottom: 1px solid #000;
}
.menu__item:hover .content {
display: block;
}
.content {
display: none;
position: absolute;
top: 0;
left: 34%;
height: 100%;
background: #ccc;
width: 50%;
}
<div class="catalog">
<ul class="menu">
<li class="menu__item">
Item1
<div class="content">
text1
</div>
</li>
<li class="menu__item">
Item2
<div class="content">
text2
</div>
</li>
<li class="menu__item">
Item3
<div class="content">
text3
</div>
</li>
</ul>
</div>