CODEWITHSUNDEEP
htmlcsshyperlinktags
Sandy
Sandy

Reputation: 3

How to position <a href > element by using CSS class?

I want o position a link at required place .The problem is that it is positioning margin left but not margin top. I don't know what is missing.

.LearnMoreTxt{
    margin-top: 15px;
    margin-left: 730px;
    color: rgb(0, 140, 255);
    text-decoration: none;
    font-size: 25px;
    font-family: sans-serif;
}
<a href="#" class="LearnMoreTxt">Learn More ></a>

Upvotes: 0

Views: 2242

Answers (2)

KuldipKoradia
KuldipKoradia

Reputation: 3031

you have to apply display: block; and white-space: nowrap; this is because of your <a> text does not break in two lines.

.LearnMoreTxt{
    margin-top: 15px;
    margin-left: 730px;
    color: rgb(0, 140, 255);
    text-decoration: none;
    font-size: 25px;
    font-family: sans-serif;
    display: block;
    white-space: nowrap;
}
<a href="#" class="LearnMoreTxt">Learn More ></a>

Upvotes: 0

Ddmteetu
Ddmteetu

Reputation: 1002

@Sandy please make your anchor (a) tag block element using display: block; in your style declaration. By default anchor (a) tags get rendered as inline elements.

.LearnMoreTxt {
    margin-top: 100px; /* change default value */
    margin-left: 100px; /* change default value */
    color: rgb(0, 140, 255);
    text-decoration: none;
    font-size: 25px;
    font-family: sans-serif;
    display: block;
}
<a href="" class="LearnMoreTxt"> Learn More > </a>

Upvotes: 1

Related Questions