How to center the text inside the anchor tag?

Course Queries Syllabus Queries 2 years ago

0 2 0 0 0 tuteeHUB earn credit +10 pts

5 Star Rating 1 Rating

Posted on 16 Aug 2022, this text provides information on Syllabus Queries related to Course Queries. Please note that while accuracy is prioritized, the data presented might not be entirely correct or up-to-date. This information is offered for general knowledge and informational purposes only, and should not be considered as a substitute for professional advice.

Take Quiz To Earn Credits!

Turn Your Knowledge into Earnings.

tuteehub_quiz

Answers (2)

Post Answer
profilepic.png
manpreet Tuteehub forum best answer Best Answer 2 years ago


I have arranged the anchor tag with text with borders. I want to make the text to center inside the block. I have tried padding, margin left, float but nothing is working.

 

body {
                background-color:black;
                background-repeat: no-repeat;
                background-size: 100% 100%;
                
            }
            .title{
                height: 17%;
                width: 100%;
                margin: 0%;
                text-align: center;
                font-size: 2rem;
                color: white;
            }
            .subjects{
                color: white;
                width: 28%;
                height: 7%;
                border: 2px solid white;
                font-size: 2rem;
                border-radius:20px;
                margin-top: 86px;
                margin-left: 8px;
                text-align:center;
                vertical-align: middle;
            }
            
            .maths{
                margin-left: 24%;
                margin-top: 41px;
            }
           
            .maths a{
                text-decoration: none;
                color: white;
                border: 2px solid white;
                padding: 4px;
                padding-right: 140px;
                font-size: 2rem;
                border-radius: 20px;
                cursor: pointer;
                vertical-align:middle;
                display: inline-block;
                
            }
             .physics{
                margin-left: 24%;
                margin-top: 41px;
            }
           
            .physics a{
                text-decoration: none;
                color: white;
                border: 2px solid white;
                padding: 4px 103px;
                padding-right: 206px;
                font-size: 2rem;
                border-radius: 20px;
                cursor: pointer;
                vertical-align:middle;
                display: inline-block;
                
            }
             .chemistry{
                margin-left: 24%;
                margin-top: 41px;
            }
           
            .chemistry a{
                text-decoration: none;
                color: white
                                                
                                                
0 views
0 shares
profilepic.png
manpreet 2 years ago

Just change the padding (left and right padding to half of what you had for right padding):

 

.physics{
                margin-left: 24%;
                margin-top: 41px;
            }
           
            .physics a{
                text-decoration: none;
                color: black;
                border: 2px solid black;
                padding: 4px 103px;
                font-size: 2rem;
                border-radius: 20px;
                cursor: pointer;
                vertical-align:middle;
                display: inline-block;    
            }
<div class="physics">
            
             href="physicsinfo.html" target="_blank">Physics
        div>

0 views   0 shares

No matter what stage you're at in your education or career, TuteeHub will help you reach the next level that you're aiming for. Simply,Choose a subject/topic and get started in self-paced practice sessions to improve your knowledge and scores.