Jump to content

Recommended Posts

I will try to explain the problem as much as I can before posting the code.

I have a div which's width is determined by the size of the content. It contains two div's, one is the div which contains the picture and the second one is the div that has the description of the picture: date of upload and name of the file (this needs to be glued to the right side of the div).

Here is the html code for it:

 

<div class="box">
<div class="picture">
	<img src="path/to/img" alt="" />
</div>
<div class="description">
	<span id="date">date of upload</span> <span id="picture_name">picture_name</span>
</div>
</div>

 

And the problem here is when I have small pictures the "description" row can't get the width I need without breaking (because I am putting float right on the picture name). The file name goes on other row.

The question is how to stretch the row, so the date and picture name are on the same row?

Link to comment
https://forums.phpfreaks.com/topic/253821-stretching-divs-width/
Share on other sites

I'm sure your not giving us all the info we need.

The widest div : either the  picture div or the description div will determine the width of the box div. Nothing should break. Picture on top date and name on the bottom.

 

(because I am putting float right on the picture name)
Kinda tells me you have given the box div dimensions. Lets see the whole code, please. Or remove the width of the box div.

True what You say that the widest div gives the width of the box. The problem is (and I think it is only in IE9) that when the width of the div should be determined by the width of the description row, it pushes the floated span in the next row.

There is nothing more to the code because this is a absolute positioned div on the screen (like a lightbox)

  • 2 weeks later...
This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.