Comments on: What Does “width: 100%” Do in CSS? http://www.impressivewebs.com/width-100-percent-css/ Web Design Articles & Tutorials. To make the web impressive. Sat, 04 Feb 2012 01:11:21 +0000 hourly 1 http://wordpress.org/?v=3.3.1 By: Sidney http://www.impressivewebs.com/width-100-percent-css/#comment-10508 Sidney Wed, 26 Oct 2011 08:07:46 +0000 http://www.impressivewebs.com/?p=1925#comment-10508 Good stuff man keep up the good work. Good stuff man keep up the good work.

]]> By: Forkoff http://www.impressivewebs.com/width-100-percent-css/#comment-10499 Forkoff Mon, 24 Oct 2011 14:32:25 +0000 http://www.impressivewebs.com/?p=1925#comment-10499 One thing that gets caught our by this is iFrames. The only fix I found is to wrap my iFrame in another DIV and put my margins on that, then set the iFrame to 100%. Dirty but it works, and yes, I know iFrames are dirty, but I'm o9nly using them for simple time-saver apps for use within the company and never use iFrames in work for our clients unless absolutely necessary! One thing that gets caught our by this is iFrames. The only fix I found is to wrap my iFrame in another DIV and put my margins on that, then set the iFrame to 100%. Dirty but it works, and yes, I know iFrames are dirty, but I’m o9nly using them for simple time-saver apps for use within the company and never use iFrames in work for our clients unless absolutely necessary!

]]> By: subduedjoy http://www.impressivewebs.com/width-100-percent-css/#comment-9461 subduedjoy Sat, 30 Jul 2011 21:27:54 +0000 http://www.impressivewebs.com/?p=1925#comment-9461 You don't even need a JQuery plugin. It takes very little JavaScript code to calculate the remaining width (or height for that matter) of the last element and set it accordingly. I, too, wish we could do it with CSS. You don’t even need a JQuery plugin. It takes very little JavaScript code to calculate the remaining width (or height for that matter) of the last element and set it accordingly. I, too, wish we could do it with CSS.

]]> By: Moiz Raja http://www.impressivewebs.com/width-100-percent-css/#comment-9055 Moiz Raja Thu, 12 May 2011 20:54:48 +0000 http://www.impressivewebs.com/?p=1925#comment-9055 Very well explained. Very well explained.

]]> By: Theo http://www.impressivewebs.com/width-100-percent-css/#comment-8825 Theo Thu, 17 Mar 2011 06:44:42 +0000 http://www.impressivewebs.com/?p=1925#comment-8825 Fantastic point on the <code>"width:remainder"</code> parameter. How could they miss it! Fantastic point on the "width:remainder" parameter. How could they miss it!

]]> By: David http://www.impressivewebs.com/width-100-percent-css/#comment-7601 David Thu, 18 Nov 2010 02:46:26 +0000 http://www.impressivewebs.com/?p=1925#comment-7601 I use CSS width:100%; to scale images to fit into an area of my page; then when the image is clicked, I show the image in its actual large size. I use CSS width:100%; to scale images to fit into an area of my page; then when the image is clicked, I show the image in its actual large size.

]]> By: Alex http://www.impressivewebs.com/width-100-percent-css/#comment-7549 Alex Thu, 11 Nov 2010 20:35:05 +0000 http://www.impressivewebs.com/?p=1925#comment-7549 Thank you for writing this. It really helped me to understand css widths better. Much appreciated. Thank you for writing this. It really helped me to understand css widths better. Much appreciated.

]]> By: dragonmaster http://www.impressivewebs.com/width-100-percent-css/#comment-6753 dragonmaster Wed, 01 Sep 2010 07:32:08 +0000 http://www.impressivewebs.com/?p=1925#comment-6753 Nice! Thank You. Nice! Thank You.

]]> By: Wayne http://www.impressivewebs.com/width-100-percent-css/#comment-6401 Wayne Sun, 08 Aug 2010 04:28:58 +0000 http://www.impressivewebs.com/?p=1925#comment-6401 nesting divs also works <div style="padding:10px" comment="padding color is parent color"> <div style="background:#963" comments="div color does not extent into padding"> foo bar </div> </div> nesting divs also works

<div style=”padding:10px” comment=”padding color is parent color”>
<div style=”background:#963″ comments=”div color does not extent into padding”>
foo bar
</div>
</div>

]]> By: Wayne http://www.impressivewebs.com/width-100-percent-css/#comment-6400 Wayne Sun, 08 Aug 2010 04:17:06 +0000 http://www.impressivewebs.com/?p=1925#comment-6400 Searching in hopes somebody had a better solution. I would like to theme a template with a centered 960px divide (which needs the width) with a logo of unknown width to float left in this 960 divide. Then "because the menu bar has a background", it needs to take up the remainder of the space without becoming to wide and dropping below the logo. Looks like I need to place a background on the 960 wrapper, that gets covered up by a background for the logo div.. Then the menu bar wrapper only has an image on the left to cover up the 960 wrapper background so the left edge of the menu is correct. And the menubar wrapper will only use the space needed letting the menubar graphics on the right edge of the 960 layout be filled in by the background wrapper. I can do this but I pity the fool who wants to change the menu bar graphic. Searching in hopes somebody had a better solution.

I would like to theme a template with a centered 960px divide (which needs the width) with a logo of unknown width to float left in this 960 divide. Then “because the menu bar has a background”, it needs to take up the remainder of the space without becoming to wide and dropping below the logo.

Looks like I need to place a background on the 960 wrapper, that gets covered up by a background for the logo div.. Then the menu bar wrapper only has an image on the left to cover up the 960 wrapper background so the left edge of the menu is correct. And the menubar wrapper will only use the space needed letting the menubar graphics on the right edge of the 960 layout be filled in by the background wrapper. I can do this but I pity the fool who wants to change the menu bar graphic.

]]>