text-align not working on link - html

Question

I want the link to be on the left of "info" div, but I can't figure out a way to do it, text-align: left; is not working. I think that maybe the CSS is interfering with the text-align property.
#font-face {
font-family: myFirstFont;
src: url(Minecraftia.ttf);
}
a {
font-family: myFirstFont;
text-decoration: none;
font-size: 13px;
}
div#comment {
border-radius: 4px;
margin: 0 auto;
padding: 0 3px;
width: 600px;
}
input[type=submit] {
background-color: white;
font-size: large;
padding: 14px 20px;
margin: 8px 0;
border: 3px solid green;
border-radius: 10px;
cursor: pointer;
font-family: myFirstFont;
text-align: center;
}
input[type=text], input[type=mail], select {
width: 600px;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #CCC;
border-radius: 4px;
box-sizing: border-box;
background-color: #F8F8F8;
font-family: myFirstFont;
}
textarea {
width: 600px;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #CCC;
border-radius: 4px;
box-sizing: border-box;
background-color: #F8F8F8;
font-family: myFirstFont;
resize: none;
}
p
{
font-family: myFirstFont;
font-size: 13px;
margin: 0 auto;
}
div#info {
border-radius: 4px;
margin: 0 auto;
padding: 0 3px;
width: 600px;
border-bottom: 1px solid green;
}
form {
text-align: center;
}
<div id="info"><p>Pringui - 25 août 2016 - Modifier</p></div><div id="comment"> <p>Hello World.</p></div>

Answer 1

You can use floating to move the link before the other text:
a {
float: left;
}
#font-face {
font-family: myFirstFont;
src: url(Minecraftia.ttf);
}
a {
font-family: myFirstFont;
text-decoration: none;
font-size: 13px;
float: left;
}
a::after {
content: ' - ';
white-space: pre;
}
div#comment {
border-radius: 4px;
margin: 0 auto;
padding: 0 3px;
width: 600px;
}
input[type=submit] {
background-color: white;
font-size: large;
padding: 14px 20px;
margin: 8px 0;
border: 3px solid green;
border-radius: 10px;
cursor: pointer;
font-family: myFirstFont;
text-align: center;
}
input[type=text],
input[type=mail],
select {
width: 600px;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #CCC;
border-radius: 4px;
box-sizing: border-box;
background-color: #F8F8F8;
font-family: myFirstFont;
}
textarea {
width: 600px;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #CCC;
border-radius: 4px;
box-sizing: border-box;
background-color: #F8F8F8;
font-family: myFirstFont;
resize: none;
}
p {
font-family: myFirstFont;
font-size: 13px;
margin: 0 auto;
}
div#info {
border-radius: 4px;
margin: 0 auto;
padding: 0 3px;
width: 600px;
border-bottom: 1px solid green;
}
form {
text-align: center;
}
<div id="info">
<p>Pringui - 25 août 2016 Modifier
</p>
</div>
<div id="comment">
<p>Hello World.</p>
</div>

Answer 2

If I understand what you're wanting correctly, then you don't need to edit the CSS. You can just move the anchor to the left of the content inside that div. Or if you want it before the div completely move it outside of the div. If that's not an option you can float the div right and then float the anchor left. But this is a pretty sloppy solution. It'd be better to simply rearrange the HTML.
#font-face {
font-family: myFirstFont;
src: url(Minecraftia.ttf);
}
a {
font-family: myFirstFont;
text-decoration: none;
font-size: 13px;
}
div#comment {
border-radius: 4px;
margin: 0 auto;
padding: 0 3px;
width: 600px;
}
input[type=submit] {
background-color: white;
font-size: large;
padding: 14px 20px;
margin: 8px 0;
border: 3px solid green;
border-radius: 10px;
cursor: pointer;
font-family: myFirstFont;
text-align: center;
}
input[type=text], input[type=mail], select {
width: 600px;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #CCC;
border-radius: 4px;
box-sizing: border-box;
background-color: #F8F8F8;
font-family: myFirstFont;
}
textarea {
width: 600px;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #CCC;
border-radius: 4px;
box-sizing: border-box;
background-color: #F8F8F8;
font-family: myFirstFont;
resize: none;
}
p
{
font-family: myFirstFont;
font-size: 13px;
margin: 0 auto;
}
div#info {
border-radius: 4px;
margin: 0 auto;
padding: 0 3px;
width: 600px;
border-bottom: 1px solid green;
float: right;
}
#info a {
float: left;
margin-right: 5px;
}
form {
text-align: center;
}
<div id="info"><p>Pringui - 25 août 2016 - Modifier</p></div><div id="comment"> <p>Hello World.</p></div>