diff --git a/src/components/resume/shared/items/awards-item.tsx b/src/components/resume/shared/items/awards-item.tsx
index 656e710f4..261ff75e6 100644
--- a/src/components/resume/shared/items/awards-item.tsx
+++ b/src/components/resume/shared/items/awards-item.tsx
@@ -45,9 +45,9 @@ export function AwardsItem({ className, ...item }: AwardsItemProps) {
     <div className={cn("awards-item", className)}>
       {/* Header */}
       <div className="section-item-header awards-item-header">
-        <div className="grid grid-cols-2 items-start gap-x-2">
+        <div className="grid grid-cols-2 items-start justify-between gap-x-2">
           {headerFields.map((field, index) => (
-            <div key={field.key} className={cn(index % 2 === 1 && "shrink-0 justify-self-end text-end")}>
+            <div key={field.key} className={cn(index % 2 === 1 && "text-end whitespace-nowrap")}>
               {field.content}
             </div>
           ))}
diff --git a/src/components/resume/shared/items/certifications-item.tsx b/src/components/resume/shared/items/certifications-item.tsx
index 343c7428e..60ea3b717 100644
--- a/src/components/resume/shared/items/certifications-item.tsx
+++ b/src/components/resume/shared/items/certifications-item.tsx
@@ -45,9 +45,9 @@ export function CertificationsItem({ className, ...item }: CertificationsItemPro
     <div className={cn("certifications-item", className)}>
       {/* Header */}
       <div className="section-item-header certifications-item-header">
-        <div className="grid grid-cols-2 items-start gap-x-2">
+        <div className="grid grid-cols-2 items-start justify-between gap-x-2">
           {headerFields.map((field, index) => (
-            <div key={field.key} className={cn(index % 2 === 1 && "shrink-0 justify-self-end text-end")}>
+            <div key={field.key} className={cn(index % 2 === 1 && "text-end whitespace-nowrap")}>
               {field.content}
             </div>
           ))}
diff --git a/src/components/resume/shared/items/education-item.tsx b/src/components/resume/shared/items/education-item.tsx
index 49b134bdd..36d96221f 100644
--- a/src/components/resume/shared/items/education-item.tsx
+++ b/src/components/resume/shared/items/education-item.tsx
@@ -52,9 +52,9 @@ export function EducationItem({ className, ...item }: EducationItemProps) {
     <div className={cn("education-item", className)}>
       {/* Header */}
       <div className="section-item-header education-item-header mb-2">
-        <div className="grid grid-cols-2 items-start gap-x-2">
+        <div className="grid grid-cols-2 items-start justify-between gap-x-2">
           {headerFields.map((field, index) => (
-            <div key={field.key} className={cn(index % 2 === 1 && "shrink-0 justify-self-end text-end")}>
+            <div key={field.key} className={cn(index % 2 === 1 && "text-end whitespace-nowrap")}>
               {field.content}
             </div>
           ))}
diff --git a/src/components/resume/shared/items/experience-item.tsx b/src/components/resume/shared/items/experience-item.tsx
index d89006dbc..a99d814af 100644
--- a/src/components/resume/shared/items/experience-item.tsx
+++ b/src/components/resume/shared/items/experience-item.tsx
@@ -51,9 +51,9 @@ export function ExperienceItem({ className, ...item }: ExperienceItemProps) {
     <div className={cn("experience-item", className)}>
       {/* Header */}
       <div className="section-item-header experience-item-header">
-        <div className="grid grid-cols-2 items-start gap-x-2">
+        <div className="grid grid-cols-2 items-start justify-between gap-x-2">
           {headerFields.map((field, index) => (
-            <div key={field.key} className={cn(index % 2 === 1 && "shrink-0 justify-self-end text-end")}>
+            <div key={field.key} className={cn(index % 2 === 1 && "text-end whitespace-nowrap")}>
               {field.content}
             </div>
           ))}
@@ -65,11 +65,11 @@ export function ExperienceItem({ className, ...item }: ExperienceItemProps) {
         <div className="experience-item-roles mt-0 flex flex-col gap-y-1">
           {item.roles.map((role) => (
             <div key={role.id} className="experience-item-role">
-              <div className="flex items-start justify-between gap-x-2">
-                <span className="section-item-metadata experience-item-role-position">{role.position}</span>
-                <span className="section-item-metadata experience-item-role-period shrink-0 justify-self-end text-end">
+              <div className="grid grid-cols-2 items-start justify-between gap-x-2">
+                <div className="section-item-metadata experience-item-role-position">{role.position}</div>
+                <div className="section-item-metadata experience-item-role-period text-end whitespace-nowrap">
                   {role.period}
-                </span>
+                </div>
               </div>
 
               {stripHtml(role.description) && (
diff --git a/src/components/resume/shared/items/publications-item.tsx b/src/components/resume/shared/items/publications-item.tsx
index a8bdbc739..1ad994b8b 100644
--- a/src/components/resume/shared/items/publications-item.tsx
+++ b/src/components/resume/shared/items/publications-item.tsx
@@ -45,9 +45,9 @@ export function PublicationsItem({ className, ...item }: PublicationsItemProps)
     <div className={cn("publications-item", className)}>
       {/* Header */}
       <div className="section-item-header publications-item-header">
-        <div className="grid grid-cols-2 items-start gap-x-2">
+        <div className="grid grid-cols-2 items-start justify-between gap-x-2">
           {headerFields.map((field, index) => (
-            <div key={field.key} className={cn(index % 2 === 1 && "shrink-0 justify-self-end text-end")}>
+            <div key={field.key} className={cn(index % 2 === 1 && "text-end whitespace-nowrap")}>
               {field.content}
             </div>
           ))}
diff --git a/src/components/resume/shared/items/references-item.tsx b/src/components/resume/shared/items/references-item.tsx
index a4fc4eb48..3e65b40df 100644
--- a/src/components/resume/shared/items/references-item.tsx
+++ b/src/components/resume/shared/items/references-item.tsx
@@ -40,9 +40,9 @@ export function ReferencesItem({ className, ...item }: ReferencesItemProps) {
     <div className={cn("references-item", className)}>
       {/* Header */}
       <div className="section-item-header references-item-header">
-        <div className="grid grid-cols-2 items-start gap-x-2">
+        <div className="grid grid-cols-2 items-start justify-between gap-x-2">
           {headerFields.map((field, index) => (
-            <div key={field.key} className={cn(index % 2 === 1 && "shrink-0 justify-self-end text-end")}>
+            <div key={field.key} className={cn(index % 2 === 1 && "text-end whitespace-nowrap")}>
               {field.content}
             </div>
           ))}
diff --git a/src/components/resume/shared/items/volunteer-item.tsx b/src/components/resume/shared/items/volunteer-item.tsx
index cf315bc53..2f9a9dbe5 100644
--- a/src/components/resume/shared/items/volunteer-item.tsx
+++ b/src/components/resume/shared/items/volunteer-item.tsx
@@ -45,9 +45,9 @@ export function VolunteerItem({ className, ...item }: VolunteerItemProps) {
     <div className={cn("volunteer-item", className)}>
       {/* Header */}
       <div className="section-item-header volunteer-item-header">
-        <div className="grid grid-cols-2 items-start gap-x-2">
+        <div className="grid grid-cols-2 items-start justify-between gap-x-2">
           {headerFields.map((field, index) => (
-            <div key={field.key} className={cn(index % 2 === 1 && "shrink-0 justify-self-end text-end")}>
+            <div key={field.key} className={cn(index % 2 === 1 && "text-end whitespace-nowrap")}>
               {field.content}
             </div>
           ))}