Need a clue on how to create this div box

D

Danny Anderson

Hola, html folk!

I am trying to combine a div box with a graphic. There is a poorly
executed approximation here:
http://www.cs.odu.edu/~danders/cs411/files.php

How do I get the graphic and the div hooked together? I would like to get
the graphic centered in the middle of the blue box, a little to the left
of the left hand border. I have a couple different icons I want to use,
but they are the same size as the one in the example page above.

Any hints, advice, referrals, etc., much appreciated!

Danny
 
B

Barry Pearson

Danny said:
Hola, html folk!

I am trying to combine a div box with a graphic. There is a poorly
executed approximation here:
http://www.cs.odu.edu/~danders/cs411/files.php

How do I get the graphic and the div hooked together? I would like
to get the graphic centered in the middle of the blue box, a little
to the left of the left hand border. I have a couple different icons
I want to use, but they are the same size as the one in the example
page above.

If I understand it, you are letting the quickbox flow into place normally,
without positioning, but you are trying to make an absolutely positioned
element, quickbox_ icon, align with it? (If I've got that wrong, ignore what I
say below).

That is probably doomed. It will blow apart whenever anything disturbs the
normal flow. It blows apart when I use a large text size, for example.

I think you will have to wrap the 2 of them together to ensure they stay
together, then position each of them somehow within the wrapper. For example:

<div id="quickwrapper">
<div id="quickicon"><img .......></div>
<div id="quickbox">....</div>
</div>

Then you might float the icon left, and let the box flow normally into place
with a 50px left margin so that it doesn't overwrite the icon.

There are other options, of course - but I think the key is the wrapping them
together.
 
M

Mitja

Danny Anderson said:
Hola, html folk!

I am trying to combine a div box with a graphic. There is a poorly
executed approximation here:
http://www.cs.odu.edu/~danders/cs411/files.php

How do I get the graphic and the div hooked together? I would like to get
the graphic centered in the middle of the blue box, a little to the left
of the left hand border. I have a couple different icons I want to use,
but they are the same size as the one in the example page above.

Any hints, advice, referrals, etc., much appreciated!

Danny

Put green_hand.gif directly inside quickbox, then use "position:relative;
top:-Xpx", where X is half the height of green_hand. That's probably not
all, but from here on, it shouldn't take much from here to get it to work.

Mitja
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,769
Messages
2,569,580
Members
45,054
Latest member
TrimKetoBoost

Latest Threads

Top