Hossain Khademian
Hossain Khademian

Reputation: 1706

HTML a content top

I have an a tag with these content:

<a height="0">
    <img style="width:100px; height:100px; display:inline;" src="..." >
    <div style="width:100px; height:100px; display:inline;" src="..." >
        Hello
    </div>
</a>

I want: the div contents shows from top of a but it shows from middle I set a's height to 0 because of my projects not for this issue; I test css top margin padding valign ... but no one make it true

enter image description here

Upvotes: 0

Views: 140

Answers (3)

ummahusla
ummahusla

Reputation: 2063

there is a lot of ways of implementing it, here is my solution. It's just simply floating elements. Works fine.

img {
    width:100px;
    height:100px;
    float:left;
}
div {
    width:100px;
    height:100px;
    float: left;
}
<a height="0">
    <img src="..." >
    <div src="..." >
        Hello
    </div>
</a>

Upvotes: 1

user700284
user700284

Reputation: 13620

Give float:left for your div

sample http://jsfiddle.net/uLqa2ky5/

Upvotes: 0

James Donnelly
James Donnelly

Reputation: 128856

Give your div element a vertical-align of top:

div {
  vertical-align: top;
}
<a height="0">
    <img style="width:100px; height:100px; display:inline;" src="http://placehold.it/100x100" >
    <div style="width:100px; height:100px; display:inline;" src="..." >
        Hello
    </div>
</a>

Upvotes: 1

Related Questions