troubleshooting Question

Column Names not quite centering

Avatar of curiouswebster
curiouswebsterFlag for United States of America asked on
JavaScriptCSSHTMLScripting Languages* Angular4
3 Comments1 Solution193 ViewsLast Modified:
I have the correct columns names appearing, but have a hard time getting them to actually center on each puzzle piece.

Column names out of center
The CSS I created is here.

puzzle-canvas.component.css
.column-number {
    width: 12%;
    margin-top: 12px;
    float: left;
    box-sizing: border-box;
    position: relative;
    text-align: center;
    z-index: 10;
}

The single line I added to the template is:

puzzle-canvas.component.html
    <div class="column-number" *ngFor="let i of columnNames" >{{ i }}</div>
ASKER CERTIFIED SOLUTION
Join our community to see this answer!
Unlock 1 Answer and 3 Comments.
Start Free Trial
Learn from the best

Network and collaborate with thousands of CTOs, CISOs, and IT Pros rooting for you and your success.

Andrew Hancock - VMware vExpert
See if this solution works for you by signing up for a 7 day free trial.
Unlock 1 Answer and 3 Comments.
Try for 7 days

”The time we save is the biggest benefit of E-E to our team. What could take multiple guys 2 hours or more each to find is accessed in around 15 minutes on Experts Exchange.

-Mike Kapnisakis, Warner Bros