diff --git a/src/client/src/components/todos/todoItem.tsx b/src/client/src/components/todos/todoItem.tsx
index aa9eac4..c445e6e 100644
--- a/src/client/src/components/todos/todoItem.tsx
+++ b/src/client/src/components/todos/todoItem.tsx
@@ -12,10 +12,10 @@ export const TodoItem: FC<TodoItemProps> = (props) => (
   <div className="py-3 border-b border-gray-300 dark:border-gray-600">
     <div className="flex items-center space-x-4">
       <TodoCheckmark {...props} />
-      <div className="flex flex-row flex-grow gap-2 pr-6">
+      <div className="flex flex-col md:flex-row flex-grow gap-0.5 md:gap-2 pr-6">
         <div className="flex-grow w-full break-all">{props.todo.title}</div>
         {props.displayProject && props.todo.project && (
-          <div className="text-gray-500 text-right whitespace-nowrap">
+          <div className="text-gray-500 text-xs text-right whitespace-nowrap place-self-end">
             {props.todo.project}
           </div>
         )}