File APIs for Java Developers
Manipulate DOC, XLS, PPT, PDF and many others from your application.
The moose likes HTML, CSS and JavaScript and the fly likes Div alignments when using corner images Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "Div alignments when using corner images" Watch "Div alignments when using corner images" New topic

Div alignments when using corner images

Deepa Pillai

Joined: Mar 27, 2008
Posts: 5
I need curved images around the corner ,and am using below code ,

<div class="lfcorner">
<div class="rtcorner">
<div class="lttopcorner">
<div class="toprtcorner">
<div>AA </div>
<div>BB </div>

css for above code,

.btmlfcorner {background: url(lfcorner.gif) 0 100% no-repeat #FFFFFF; }
.btmlrtcorner {background: url(rtcorner.gif) 100% 100% no-repeat}
.lttopcorner {background: url(lttopcorner.gif) 0 0 no-repeat}
.toprtcorner {background: url(oprtcorner.gif) 100% 0 no-repeat; padding:10px}

I need text AA and BB to align in one line ,but BB is moving to next line.If i use the span and with position absolute it works , but i need to achieve this using div.

Please let me know where am going wrong in building images for corners or getting text aligned.

Katrina Owen

Joined: Nov 03, 2006
Posts: 1367
Hi Deepa,

It looks like you are trying to use divs to replace table cells in a one-to-one map. My guess (even without knowing more about what you are trying to achieve) is that there is an easier way.

div elements are usually block elements by default, and span elements are inline elements.

You can use CSS to tell span elements to display as block elements and div elements to display inline, however if you could post a link to an image of what you are trying to achieve, we might be able to help you do so in an easier way.

I agree. Here's the link:
subject: Div alignments when using corner images
It's not a secret anymore!