css - way to not have width assume 100%?

Question

So when you put a <div> within a <div>, it assumes it should be all the way wide.

I have an <a> element, and the only way to get it to display correctly is to give it display: block. However, giving it this attribute makes it behave like the <div> does by default. It makes it all the way wide.

I don't have a specific width I want it (just so the text and padding fit) but I don't want it to be all the way wide.

Is there an attribute/workaround for this?

I would post some code but it's a simple enough idea - just say so if you'd like to see some code.

Please show some code, your question is also kind of ambiguous. — kmiyashiro
– kmiyashiro, Commented Nov 18, 2010 at 0:57
"and the only way to get it to display correctly" - you need to elaborate on this. what is going wrong? — pstanton
– pstanton, Commented Nov 18, 2010 at 1:04

kmiyashiro · Accepted Answer · 2010-11-18 00:58:02Z

1

One way is to use display: inline-block;, but there are only a few times when that is really necessary.

Post some code so we can tell what is causing your anchors to disappear or do whatever undesirable behavior it is.

Oh, it would be helpful to know what you want them to look like.

answered Nov 18, 2010 at 0:58

kmiyashiro

2,25914 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

user8710 Over a year ago

I'm sure inline-block is what he wants -- +1.If anyone still cares about IE6, then make sure the element is inline by default. <div>s won't work with inline block in IE6, but if you use a <span> instead it will.

SLaks · Accepted Answer · 2010-11-18 00:58:33Z

0

You're looking for display: inline.

If you really need display: block, you can make it "shrink-wrap" by setting float: left.

answered Nov 18, 2010 at 0:58

SLaks

891k182 gold badges1.9k silver badges2k bronze badges

Comments

John Hartsock · Accepted Answer · 2010-11-18 00:58:35Z

0

Try using

display:inline

answered Nov 18, 2010 at 0:58

John Hartsock

87.1k23 gold badges135 silver badges146 bronze badges

Comments

Šime Vidas · Accepted Answer · 2010-11-18 00:59:50Z

0

You can float it:

div { overflow:auto; }
a { float:left; }


<div>
    <a> Link </a>
</div>

answered Nov 18, 2010 at 0:59

Šime Vidas

187k66 gold badges290 silver badges392 bronze badges

Collectives™ on Stack Overflow

css - way to not have width assume 100%?

4 Answers 4

1 Comment

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related