I want to align my UI element to the right only with CSS.
here is my CSS code.
nav {
display: flex;
padding: 20px;
font-family: Arial;
background-color: #4E00A7;
text-align: right;
}
nav li {
font-family: "Roboto", sans-serif;
font-weight: 500;
font-style: normal;
display: inline-block;
}
nav li a {
color: white;
float: right;
margin-left: auto;
text-decoration: none;
padding-left: 10px;
padding-right: 10px;
}
.roboto-bold-italic {
font-family: "Roboto", sans-serif;
font-weight: 700;
font-style: italic;
}
.roboto-bold {
font-family: "Roboto", sans-serif;
font-weight: 700;
font-style: normal;
}
.roboto-medium {
font-family: "Roboto", sans-serif;
font-weight: 500;
font-style: normal;
}
.pull-right {
float: right;
}
and a screenshot of my current HTML doc
Html Document renderd
I’ve tried floating it to the right, text aligning it, hoping it would go left.
New contributor
Extraskilled56 is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.