Camillia
asked on
Moving text to the right
I've attached how the image looks like now. I have
"Billing" and Edit" next to each other. How can I shift the word "Edit" to the right.
These are the CSS tags I have
And it renders to this div
"Billing" and Edit" next to each other. How can I shift the word "Edit" to the right.
These are the CSS tags I have
#checkout_header {
font-family: 'ProximaNovaBlack', Arial, Helvetica, sans-serif;
background: url(../images/sprite_checkout.png) 0 -156px;
height: 38px;
font-size: 20px;
padding: 5px 0px 0px 10px;
border: solid 2px #efefef;
}
#checkout_header .checkout_header_text {
padding: 0px 0px 0px 10px;
}
.checkout_header_bgStep2 {
background: url('../images/sprite_checkout.png') no-repeat -2px -31px;
display: inline-block;
width: 26px;
height: 26px;
}
And it renders to this div
<div id="checkout_header" class="spriteIcon">
<span class="checkout_header_bgStep2"></span>
<span class="checkout_header_text">Billing
<a href="https:...."><!-- dwMarker="link" dwPipelineTitle="COBil-Start" dwPipelineURL="http://localhost:60606/target=/c/core/p/COBil-Start" -->Edit</a>
</span>
</div>
Doc5.docx
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
it looks much much better but that "1" image is now to the right of "Shipping". That image is a sprite image. See Doc6.
So I removed foat: left from this. It fixed the image but the text is low now. See doc 7.
#checkout_header .checkout_header_text {
padding: 0px 0px 0px 10px;
float:left;
}
This is how it renders now
So I removed foat: left from this. It fixed the image but the text is low now. See doc 7.
#checkout_header .checkout_header_text {
padding: 0px 0px 0px 10px;
float:left;
}
This is how it renders now
<div id="checkout_header" class="spriteIcon">
<span class="checkout_header_bg"></span>
<span class="checkout_header_text">Shipping
</span>
<span class="checkout_header_text_editlink">
<a href="https..."><!-- dwMarker="link" dwPipelineTitle=".....dwPipelineURL="....." -->Edit</a>
</span>
<br class="clearfloat">
</div>
I didn't see Doc6 or 7. Can you repost those?
ASKER
I played around with this padding to see if i can pad the bottom to push the text up but still didnt work
.checkout_header_text {
padding: 0px 0px 0px 10px;
}
.checkout_header_text {
padding: 0px 0px 0px 10px;
}
I apologize, this was the soonest I could get to my machine, but it appears you got it resolved. Thanks!
ASKER
yes, thanks for your help
ASKER