Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    Banned
    Join Date
    Mar 2007
    Posts
    1,523
    Thanks
    116
    Thanked 0 Times in 0 Posts

    Question set box to width of text?

    hi, on my site in the header image I have a dark box around some text, this currently fills the width of the header image, is there any way of setting it to the width of the actual text width?

    thanks

    here is my site

  • #2
    Senior Coder
    Join Date
    Aug 2006
    Posts
    1,444
    Thanks
    11
    Thanked 309 Times in 308 Posts
    Are these the boxes you're referring to?
    Code:
    				<div id="section-1" class="section section1">
    				    <p>Jewellery Boxes</p>
    				</div>
    				<div id="section-2" class="section section2">
    					<p>Moulded tags and Hangers</p>
    				</div>
    If so, rather than placing and styling a fixed size div around them, just style the background of the <p> as it will be whatever size the text is.

    Dave

  • #3
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,927
    Thanks
    6
    Thanked 1,041 Times in 1,014 Posts
    I would say display: inline-block is your choice.

  • #4
    Banned
    Join Date
    Mar 2007
    Posts
    1,523
    Thanks
    116
    Thanked 0 Times in 0 Posts
    Hi, yes I am referring to:

    Code:
    <div id="section-1" class="section section1">
    				    <p>Jewellery Boxes</p>
    				</div>
    				<div id="section-2" class="section section2">
    					<p>Moulded tags and Hangers</p>
    				</div>
    I have styled the <p> tag and added display:inline-block;

    still doesn't work?!

  • #5
    Banned
    Join Date
    Mar 2007
    Posts
    1,523
    Thanks
    116
    Thanked 0 Times in 0 Posts
    Can anyone help me here please?

  • #6
    Senior Coder
    Join Date
    Aug 2006
    Posts
    1,444
    Thanks
    11
    Thanked 309 Times in 308 Posts
    Tried yesterday, but I couldn't get to your server. The styles for both #content p and p have width:940px on them. So that's forcing the label across the entire header. Remove that fixed with, it should go back to just the size of the text.

    Dave

  • #7
    New Coder
    Join Date
    Jan 2012
    Location
    Romania
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts
    exactly ..i was just doing that ..remove the width:940 from the p and
    #content p , and with the display:inline-block; under #container p ,you should have what you want

    i`m a bit late i see:P


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •