Issues with editing CSS

[bimamib]

Good morning. Is there anyone here who can help me restore the layout of my previous resume? I’m having trouble finding a layout that matches my resume’s format—even in terms of how neat it looks. What CSS styles should I use to restore my resume’s layout from before this latest update? I’d appreciate your help and advice, everyone. Thank You.

I’ve attached images of my current resume and how it looked before the update.

Current resume

Resume before the update

How can I align the dates for the certifications so they’re all on the left? Also, how can I make it look like my resume did before this update? Could anyone please help me with this?. Thank You

[amruthpillai]

@bimamib The wrapping date is a real gap, not something you could fix with CSS before — that row had no selector at all. It does now: the shared item header row is exposed as template-part[name="item-header-row"], so certifications, awards, projects, and publications can all pin their date back to the right.

Paste this into Builder → right sidebar → Custom Styles:

@version 1;

/* Keep the title and its date on one line so the date stays pinned right. */
template-part[name="item-header-row"] {
	flex-wrap: nowrap;
}

That is the whole fix for the date alignment. The row ships with flex-wrap: wrap, so a long title like "Belajar Membuat Aplikasi Android untuk Pemula" pushes the date onto its own line, where it left-aligns and looks inconsistent down the list. nowrap keeps it in the row.

Want it only on certifications and not the other sections:

@version 1;

section[type="certifications"] template-part[name="item-header-row"] {
	flex-wrap: nowrap;
}

Note this lands in the next release (after v5.2.7) — the selector isn't in your build yet if you're on the current version.

Hope that helps! ❤️

[bimamib]

Thank you, Mr. Amruth, for your response. I tried both pieces of code, but the issue hasn’t been resolved yet. The text in the title and the date are overlapping. Here is the existing CSS style, Mr. Amruth.

Here’s the result of me trying the first suggestion

and here’s the result of trying the second suggestion

Here’s my existing Custom CSS. Is there something wrong here, sir? Please advise and help me. Thank you

@version 1;

/* Experience: List item content */
section[type="experience"] rich-text list-item-content {
	margin-left: 5pt;
	margin-right: 10pt;
}

/* Experience: List */
section[type="experience"] rich-text list {
	margin-left: -5pt;
}

[amruthpillai]

@bimamib Oh, my bad. You actually need this:

template-part[name="item-header-row"] {
	flex-wrap: nowrap;
}

nowrap will ensure they do not overlap. Here is a screenshot of how it looks on production right now.

[bimamib]

Okay, Mr. Amruth, thank you for your answer. I’ll try that code

[bimamib]

Okay, Mr. Amruth @amruthpillai , this is correct, but is it possible to increase the spacing even more? What would the code template look like if I wanted to add more space between the title and the date? Also, one more thing—how can I reduce the spacing of that blue border line, Mr. Amruth? Thank you, Mr. Amruth.