Width of DIV as regards to contents

R

Rob Martin

Hi crew

(Obviously) new at divs... I'm testing a div area out that will eventually
be a DHML mouseover popup (just an option if supported, the page will still
work when clicking on the mouseover link). The div takes up the entire width
of the screen; I realise you can add 'width' etc - but this is specific.
Anyone know how to make the width of the div as long as the widest contents?
(I suppose that doesnt make sense with wrapping on a small screen, but you
can see what I'm getting at). Is the best way to allow what I think would be
the max width in characters?

Cheers
Rob


<head>
<style type="text/css">
..pu {
background: #DDF2F7;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 5px;
padding-right: 5px;
border-style: solid;
border-width: 3px;
border-color: #0058B0;
}
..pu a {
font-size: 0.8em;
text-decoration: none;
background: transparent;
}
..pu a:hover {
text-decoration: underline;
font-weight: bold;
}
..pu ul {
list-style-type: none;
margin-left: 0px;
margin-top: 0px;
}
</style>
</head>
<body>
<div class="pu">
<ul>
<li><a href="*">Order Made 23/5/2003</a></li>
<li><a href="*">Notice of Hearing</a></li>
<li><a href="*">Application</a></li>
</ul>
</div>
</body>
 
B

brucie

The div takes up the entire width of the screen; I realise you can add
'width' etc - but this is specific. Anyone know how to make the width of
the div as long as the widest contents?

add width:20ex; to the .pu class. may need to make larger to
compensate for paddings.

padding-top: 10px;
padding-bottom: 10px;
padding-left: 5px;
padding-right: 5px;

padding: 10px 5px;
border-style: solid;
border-width: 3px;
border-color: #0058B0;

border:1px solid #0058B0;
font-size: 0.8em;

use %. IE has a bug with ems. you also need to think if its such a
good idea making the font 20% smaller than the size the visitor
prefers.
text-decoration: none;

if removing underlines it must be made clear in some other way that
the text is a link such as grouped in an area that is obviously a
menu. different colors are not enough.
.pu a:hover {
font-weight: bold;

don't change the font on hover. it may cause the page to jump around
to redraw or text to be cut off making it unreadable. use some other
effect.
 
R

Rob Martin

brucie said:
add width:20ex; to the .pu class. may need to make larger to
compensate for paddings.

Thanks.


use %. IE has a bug with ems. you also need to think if its such a
good idea making the font 20% smaller than the size the visitor
prefers.

Ahh yes, remember that from a while ago on this NG, Thanks for the advice.
Especially for the size comment - I'll leave it std.
if removing underlines it must be made clear in some other way that
the text is a link such as grouped in an area that is obviously a
menu. different colors are not enough.

Indeed. Just playing at the mo really, but thats to be considered. When
visible, will be against a tribunal application and this will show relevant
available documents; I thought even without underlines this may be obvious
for them. But on reflection, best to leave links as they are...
don't change the font on hover. it may cause the page to jump around
to redraw or text to be cut off making it unreadable. use some other
effect.

That's true- especially if in a border area, might go over it or have to
redraw. Righto !

Thanks for the response
Cheers
Rob
 
M

Mark Parnell

Sometime around Wed, 01 Oct 2003 04:31:28 GMT, Rob Martin is reported to
have stated:
That's true- especially if in a border area, might go over it or have to
redraw. Righto !

Saw a site once that did that - and the link happened to be on the end of a
line of text, so when you hovered over it, it jumped to the next line,
which meant you were no longer hovering over it.....you can imagine the
result. The page just sat there jumping around non-stop until you moved
your mouse away from the link.

Lots of fun. :)
 

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

No members online now.

Forum statistics

Threads
473,764
Messages
2,569,564
Members
45,039
Latest member
CasimiraVa

Latest Threads

Top