how to add footer in center using css class

Question

I am trying to set a footer in center but not work

<style>
    .footer {
        color: Black;
        margin-top: 150px;
        align-content:center;
        text-align: center;
    }
</style>

<div class="main">
   <div class="top-row footer">
        CopyRight@CCX.Com
    </div>
</div>

I am using html with css class

I want to footer in center

Edit:

after adding text-align: center; not set the footer in center see below image

Does this answer your question? [How to horizontally center a
?](https://stackoverflow.com/questions/114543/how-to-horizontally-center-a-div) — FluffyKitten, Aug 27 '20 at 08:54
@Sagar when I add text align center than background effect also cut — Raju, Aug 27 '20 at 08:56
@FluffyKitten why give -3 point that is not issue I would suggest give more and more -1 when problem is small but I add ```text-align: center;``` also not work see my edit question I already try I know this is small thing but I am not able to solve that is reason I am coming here — Raju, Aug 27 '20 at 09:17
`text-align` works with the code in your question. If that didn't work in your project then the problem is with something else. You need to do some debugging to find that code and give it to us so so we can help. We can only help you fix the problem in the code you give us - we have no idea what else you might have, we're not mind readers! Also, *I* didn't give you -3 votes! At a guess, the downvotes were for lack of effort and research - the question you have asked has been asked many times before. You say you tried but there is no evidence of that in your question. — FluffyKitten, Aug 27 '20 at 09:27
Please see how to create a [minimal,reproducible example](https://stackoverflow.com/help/minimal-reproducible-example), and edit your question to add the relevant code - preferably in a Stack Snippet using the `[<>]` button in the question editor, so that we can run the code directly in your question. — FluffyKitten, Aug 27 '20 at 09:31
@FluffyKitten sorry sir ok thanks for your suggestion I will find the solution and debugger in console log what is the issue thanks for your time — Raju, Aug 27 '20 at 09:31

Master Gordon · Answer 1 · 2020-08-27T08:59:56.253

1

This will do the trick.

<style>
    .footer {
        color: Black;
        margin-top: 150px;
        text-align: center; // <---
    }
</style>

<div class="main">
   <div class="top-row footer">
        CopyRight@CCX.Com
    </div>
</div>

edited Aug 27 '20 at 08:59

answered Aug 27 '20 at 08:55

Master Gordon

33
4

1

Welcome to Stack Overflow. Your contributions are welcome, but please note that answering questions that already have good answers on the site (like this one) like discouraged. Please see the "Answer well-asked questions" section in [How do I write a good answer?](https://stackoverflow.com/help/how-to-answer) Instead you should flag duplicate questions when you have enough rep, or comment with a link to the duplicate. Or simply just move on to well-asked questions :) – FluffyKitten Aug 27 '20 at 08:58

how to add footer in center using css class

1 Answers1