html - Text inline with image rising to top of image, padding top won't work? -

html - Text inline with image rising to top of image, padding top won't work? -

alright header of site i've little logo image, need 2 links spaced out through header.

with 2 links in, works space them, they're way @ top , can't figure out how lower them?

<div class="row"> <div class="header"> <img src="assets/caliweb.png" alt="cali logo"> </div> <p><a href="#">patents pending</a></p> <p><a href="#">partner us</a></p> </div>

css

.header p { display: inline; padding-top: 5%; padding-left: 10%; padding-right: 10%; } .header img{ float: left; padding-top: padding-left: 5%; padding-right: 10%; display: inline; }

this tried, that's not working @ all, links below image.

<div class="row"> <div class="header"> <div class="headerlogo"> <img src="assets/caliweb.png" alt="cali logo"> </div> <div class="headertext"> <p><a href="#">patents pending</a></p> <p><a href="#">partner us</a></p> </div> </div> </div>

css

.header { display:inline; } .headertext { display: inline; padding-top: 5%; padding-left: 10%; padding-right: 10%; } .headerlogo{ float: left; padding-top: padding-left: 5%; padding-right: 10%; display: inline; }

i maintain making ignorant/naive mistakes, y'all have been incredibly helpful @ helping me prepare them. appreciate it.

edit found recent problem. whilst retyping code, left , accidentally closed text out of .header tag. it's now, give thanks you.

you need create .headertext {display:block;} ... or inline-block

inline elements , padding

while padding can applied sides of inline element, left , right padding have effect on surrounding content.

inline elements , margins

while left , right edges effected, content above , below not.

html css