次のHAMLコードがあります
//haml code for template
.activities_section
%ul.row_one
%li
%a{href: "#"} lol
%li
%a{href: "#"} watched a movie
%li
%a{href: "#"} read a book
%li
%a{href: "#"} happy
%li
%a{href: "#"} sad
//CSS for section
.activities_section {
width: 220px;
height: 176px;
border-left:$base_border;
border-right:$base_border;
border-bottom:$base_border;
border-top:$base_border;
background: $light_background_color;
ul {
list-style: none;
display: block;
padding: 0;
margin: 0;
li {
padding: 5px;
font-size: 0.8em;
// text-align: center;
}
}
}
//How it looks like currently
//How I want it to look like
最後の画像に見られるように、リストが「ブロックスタイル」になるようにcssを更新するにはどうすればよいですか?