html - padding-right not working -


i having code this

        <div style="background-color: greenyellow; color: black">         <span style="padding-left:20%">t1</span>         <span style="padding-right:10%">2</span>     </div> 

currently showing this. current situation here padding right not working. should such 2 should having 10% padded right of div. there other style tag can give such padding right.required output

by default, inline elements rendered left right aligned, unless specify float property them.

that means, in given horizontal line, first span t1 rendered adjacent left border of parent , span 2 rendered adjacent span t1.

so, padding-right never being utilized, last span far away right border, unless make move right either float:right or giving margin

try this:

 <div style="background-color: greenyellow; color: black">         <span style="padding-left:20%">t1</span>         <span style=" float:right; padding-right:10%;">2</span>     </div> 

see fiddle


Comments

Popular posts from this blog

Delphi XE2 Indy10 udp client-server interchange using SendBuffer-ReceiveBuffer -

Qt ActiveX WMI QAxBase::dynamicCallHelper: ItemIndex(int): No such property in -

Enable autocomplete or intellisense in Atom editor for PHP -