diff --git a/routers/web/repo/projects.go b/routers/web/repo/projects.go
index 4908bb796d9dc..02be30bde138e 100644
--- a/routers/web/repo/projects.go
+++ b/routers/web/repo/projects.go
@@ -122,7 +122,7 @@ func Projects(ctx *context.Context) {
 
 	ctx.Data["CanWriteProjects"] = ctx.Repo.Permission.CanWrite(unit.TypeProjects)
 	ctx.Data["IsShowClosed"] = isShowClosed
-	ctx.Data["IsProjectsPage"] = true
+	ctx.Data["PageIsProjects"] = true
 	ctx.Data["SortType"] = sortType
 
 	ctx.HTML(http.StatusOK, tplProjects)
@@ -371,7 +371,7 @@ func ViewProject(ctx *context.Context) {
 		return
 	}
 
-	ctx.Data["IsProjectsPage"] = true
+	ctx.Data["PageIsProjects"] = true
 	ctx.Data["CanWriteProjects"] = ctx.Repo.Permission.CanWrite(unit.TypeProjects)
 	ctx.Data["Project"] = project
 	ctx.Data["IssuesMap"] = issuesMap
diff --git a/templates/repo/header.tmpl b/templates/repo/header.tmpl
index dac30af600c3a..7ef3653c582c7 100644
--- a/templates/repo/header.tmpl
+++ b/templates/repo/header.tmpl
@@ -203,7 +203,7 @@
 				{{end}}
 
 				{{if and (not .UnitProjectsGlobalDisabled) (.Permission.CanRead $.UnitTypeProjects)}}
-					<a href="{{.RepoLink}}/projects" class="{{if .IsProjectsPage}}active {{end}}item">
+					<a href="{{.RepoLink}}/projects" class="{{if .PageIsProjects}}active {{end}}item">
 						{{svg "octicon-project"}} {{ctx.Locale.Tr "repo.project_board"}}
 						{{if .Repository.NumOpenProjects}}
 							<span class="ui small label">{{CountFmt .Repository.NumOpenProjects}}</span>
diff --git a/templates/repo/issue/card.tmpl b/templates/repo/issue/card.tmpl
index 14d08fc0ef9cf..a79f537a2ff18 100644
--- a/templates/repo/issue/card.tmpl
+++ b/templates/repo/issue/card.tmpl
@@ -1,12 +1,12 @@
 {{with .Issue}}
 	{{if eq $.Page.Project.CardType 1}}{{/* Images and Text*/}}
-		<div class="card-attachment-images">
+		<div class="issue-card-content card-attachment-images">
 			{{range (index $.Page.issuesAttachmentMap .ID)}}
 				<img src="{{.DownloadURL}}" alt="{{.Name}}" />
 			{{end}}
 		</div>
 	{{end}}
-	<div class="content gt-p-0 gt-w-full">
+	<div class="issue-card-content">
 		<div class="gt-df gt-items-start">
 			<div class="issue-card-icon">
 				{{template "shared/issueicon" .}}
@@ -18,7 +18,7 @@
 				</a>
 			{{end}}
 		</div>
-		<div class="meta gt-my-2">
+		<div class="gt-my-2">
 			<span class="text light grey muted-links">
 				{{if not $.Page.Repository}}{{.Repo.FullName}}{{end}}#{{.Index}}
 				{{$timeStr := TimeSinceUnix .GetLastEventTimestamp ctx.Locale}}
@@ -32,16 +32,16 @@
 			</span>
 		</div>
 		{{if .MilestoneID}}
-		<div class="meta gt-my-2">
-			<a class="milestone" href="{{.Repo.Link}}/milestone/{{.MilestoneID}}">
+		<div class="gt-df gt-my-2">
+			<a class="sidebar-item-link muted" href="{{.Repo.Link}}/milestone/{{.MilestoneID}}">
 				{{svg "octicon-milestone" 16 "gt-mr-2 gt-vm"}}
-				<span class="gt-vm">{{.Milestone.Name}}</span>
+				{{.Milestone.Name}}
 			</a>
 		</div>
 		{{end}}
 		{{if $.Page.LinkedPRs}}
 		{{range index $.Page.LinkedPRs .ID}}
-		<div class="meta gt-my-2">
+		<div class="gt-my-2">
 			<a href="{{$.Issue.Repo.Link}}/pulls/{{.Index}}">
 				<span class="gt-m-0 text {{if .PullRequest.HasMerged}}purple{{else if .IsClosed}}red{{else}}green{{end}}">{{svg "octicon-git-merge" 16 "gt-mr-2 gt-vm"}}</span>
 				<span class="gt-vm">{{.Title}} <span class="text light grey">#{{.Index}}</span></span>
@@ -58,16 +58,18 @@
 		{{end}}
 	</div>
 
-	{{if or .Labels .Assignees}}
-	<div class="extra content labels-list gt-p-0 gt-pt-2">
-		{{range .Labels}}
-			<a target="_blank" href="{{$.Issue.Repo.Link}}/issues?labels={{.ID}}">{{RenderLabel ctx .}}</a>
+	{{if .Labels}}
+	<div class="issue-card-content labels-list">
+		{{range .Labels}}0
+			<a {{if $.PageIsProjects}}target="_blank"{{end}} href="{{$.Issue.Repo.Link}}/issues?labels={{.ID}}">{{RenderLabel ctx .}}</a>
+		{{end}}
+	</div>
+	{{end}}
+	{{if .Assignees}}
+	<div class="issue-card-content gt-df">
+		{{range .Assignees}}
+			<a class="flex-text-inline" {{if $.PageIsProjects}}target="_blank"{{end}} href="{{.HomeLink}}" data-tooltip-content="{{ctx.Locale.Tr "repo.projects.column.assigned_to"}} {{.Name}}">{{ctx.AvatarUtils.Avatar . 28 "mini gt-mr-3"}}</a>
 		{{end}}
-		<div class="right floated">
-			{{range .Assignees}}
-				<a target="_blank" href="{{.HomeLink}}" data-tooltip-content="{{ctx.Locale.Tr "repo.projects.column.assigned_to"}} {{.Name}}">{{ctx.AvatarUtils.Avatar . 28 "mini gt-mr-3"}}</a>
-			{{end}}
-		</div>
 	</div>
 	{{end}}
 {{end}}
diff --git a/web_src/css/features/projects.css b/web_src/css/features/projects.css
index f85430a2a80ed..eb334a9dc0368 100644
--- a/web_src/css/features/projects.css
+++ b/web_src/css/features/projects.css
@@ -73,7 +73,8 @@
 }
 
 .card-attachment-images {
-  display: inline-block;
+  display: flex;
+  flex-wrap: wrap;
   white-space: nowrap;
   overflow: hidden;
   text-align: center;
@@ -82,12 +83,18 @@
 .card-attachment-images img {
   display: inline-block;
   max-height: 50px;
+  max-width: 100%;
   border-radius: var(--border-radius);
   margin-right: 2px;
 }
 
+.card-attachment-images img:not(:first-child) {
+  padding-top: 0.25rem;
+}
+
 .card-attachment-images img:only-child {
   max-height: 90px;
+  max-width: 100%;
   margin: auto;
 }
 
diff --git a/web_src/css/repo/issue-card.css b/web_src/css/repo/issue-card.css
index 5a70de47c24ea..939870d8f8936 100644
--- a/web_src/css/repo/issue-card.css
+++ b/web_src/css/repo/issue-card.css
@@ -8,6 +8,14 @@
   background: var(--color-card);
 }
 
+.issue-card .issue-card-content {
+  width: 100%;
+}
+
+.issue-card .issue-card-content:not(:first-child) {
+  padding-top: 0.25rem;
+}
+
 .issue-card-icon,
 .issue-card-unpin {
   margin-top: 1px;