Comments on: How to Build a Variable Width Website http://www.wealthydragon.com/blog/2009/01/18/how-to-build-a-variable-width-website/ Hype-Free Internet Marketing Tips Thu, 29 Jul 2010 23:10:13 +0000 hourly 1 http://wordpress.org/?v=abc By: Variable Width Websites | Creating an Awesome Home Business http://www.wealthydragon.com/blog/2009/01/18/how-to-build-a-variable-width-website/comment-page-1/#comment-2800 Variable Width Websites | Creating an Awesome Home Business Thu, 01 Oct 2009 03:16:26 +0000 http://www.wealthydragon.com/blog/?p=358#comment-2800 [...] in Web Basics Hi there, thanks for dropping in! Interested in discovering businesses you can set up on-line? This may help! (And it's free). Come back soon, cheers, Martin. A while ago I wrote about converting some of my websites to variable width. [...] [...] in Web Basics Hi there, thanks for dropping in! Interested in discovering businesses you can set up on-line? This may help! (And it's free). Come back soon, cheers, Martin. A while ago I wrote about converting some of my websites to variable width. [...]

]]> By: WealthyDragon http://www.wealthydragon.com/blog/2009/01/18/how-to-build-a-variable-width-website/comment-page-1/#comment-2178 WealthyDragon Mon, 20 Apr 2009 08:17:53 +0000 http://www.wealthydragon.com/blog/?p=358#comment-2178 LOL..! You're welcome and I'm glad it was helpful! Thanks for visiting, cheers, Martin. LOL..!

You’re welcome and I’m glad it was helpful!

Thanks for visiting, cheers,

Martin.

]]> By: Noumenon http://www.wealthydragon.com/blog/2009/01/18/how-to-build-a-variable-width-website/comment-page-1/#comment-2177 Noumenon Mon, 20 Apr 2009 07:22:15 +0000 http://www.wealthydragon.com/blog/?p=358#comment-2177 Thanks very much for the tutorial. Because I'm (more or less) limited to using this one theme for my blog, <i>and</i> because I have almost no <b>html</b> knowledge, I'm attacking the code with all the skill of a blind lumberjack in an operating theatre to tweak it. <i>But you helped</i>, so I'll be bookmarking and browsing you again in the future. Thanks again! <abbr><em>Noumenon´s last blog post..<a href="http://palimpsest.org.uk/sidepages/?p=65" rel="nofollow">The End of Faith, by Sam Harris</a></em></abbr> Thanks very much for the tutorial. Because I’m (more or less) limited to using this one theme for my blog, and because I have almost no html knowledge, I’m attacking the code with all the skill of a blind lumberjack in an operating theatre to tweak it. But you helped, so I’ll be bookmarking and browsing you again in the future. Thanks again!

Noumenon´s last blog post..The End of Faith, by Sam Harris

]]> By: Variable Width Websites: A Couple of New Problems | Creating an Awesome Home Business http://www.wealthydragon.com/blog/2009/01/18/how-to-build-a-variable-width-website/comment-page-1/#comment-1784 Variable Width Websites: A Couple of New Problems | Creating an Awesome Home Business Wed, 04 Feb 2009 13:23:08 +0000 http://www.wealthydragon.com/blog/?p=358#comment-1784 [...] form next to my picture and get free updates by email. Thanks for visiting!I recently wrote about how to build a variable width website. I’m gradually converting all of my sites to variable width and I did another one this week, but [...] [...] form next to my picture and get free updates by email. Thanks for visiting!I recently wrote about how to build a variable width website. I’m gradually converting all of my sites to variable width and I did another one this week, but [...]

]]> By: WealthyDragon http://www.wealthydragon.com/blog/2009/01/18/how-to-build-a-variable-width-website/comment-page-1/#comment-1698 WealthyDragon Thu, 22 Jan 2009 03:14:19 +0000 http://www.wealthydragon.com/blog/?p=358#comment-1698 Hi Euroangel, Glad it was useful and I added you back in BC as well! Cheers, Martin. Hi Euroangel,

Glad it was useful and I added you back in BC as well!

Cheers,

Martin.

]]> By: Euroangel http://www.wealthydragon.com/blog/2009/01/18/how-to-build-a-variable-width-website/comment-page-1/#comment-1695 Euroangel Wed, 21 Jan 2009 21:00:20 +0000 http://www.wealthydragon.com/blog/?p=358#comment-1695 thanks for this very good info!! added you too in BC..have a great day!! <abbr><em>Euroangel´s last blog post..<a href="http://myeurotravelandadventures.blogspot.com/2009/01/beautiful-hohenfels-germany.html" rel="nofollow">Beautiful Hohenfels, Germany</a></em></abbr> thanks for this very good info!! added you too in BC..have a great day!!

Euroangel´s last blog post..Beautiful Hohenfels, Germany

]]> By: Variable width websites, twitter ribbon, What's This Web Thing, Brand Me | Web Services and Tools http://www.wealthydragon.com/blog/2009/01/18/how-to-build-a-variable-width-website/comment-page-1/#comment-1679 Variable width websites, twitter ribbon, What's This Web Thing, Brand Me | Web Services and Tools Tue, 20 Jan 2009 02:59:05 +0000 http://www.wealthydragon.com/blog/?p=358#comment-1679 [...] How to Build a Variable Width Website - Creating an Awesome Home Business Martin Malden writes this hype free blog for website and blog owners. His advice is always spot on. This week, another friend of mine, Sean, was having CSS problems. Being in the middle of my own design projects, as he described his issues my mind was cluttered with the issues I was currently facing. So I helped where I could, but didn’t really solve all of his problems. [...] [...] How to Build a Variable Width Website – Creating an Awesome Home Business Martin Malden writes this hype free blog for website and blog owners. His advice is always spot on. This week, another friend of mine, Sean, was having CSS problems. Being in the middle of my own design projects, as he described his issues my mind was cluttered with the issues I was currently facing. So I helped where I could, but didn’t really solve all of his problems. [...]

]]> By: WealthyDragon http://www.wealthydragon.com/blog/2009/01/18/how-to-build-a-variable-width-website/comment-page-1/#comment-1672 WealthyDragon Mon, 19 Jan 2009 13:42:18 +0000 http://www.wealthydragon.com/blog/?p=358#comment-1672 Sean, hi, A div within a div within a div is absolutely possible, but you may need to specify width or margin parameters for the inner divs. Check out this page: http://www.best-familyvacations.net/ ... and look for the little beige box on the left of the main content area, just below the blue panel, that contains the links to 'Cheap Flights, etc...'. That is actually a div within a div within a div within a div (4 levels). The first div is the page div, which is my main container. Within that is the page-container div (illogical terminology, I know - it's just my name for it! It's the second div.). The difference in widths of those two divs, and the top and bottom margins of the page-container div, is how I create the white margin space round the outside of the content area (the bit which contains the header image, footer area, sidebar and the main content). Within the page-container div is the content div, which is the main text area - i.e. excluding the sidebar, which is in its own div. And within the content div is that div which contains those links. Plus - all the images are in their own divs as well. I'm not sure why your divs are breaking out, but first thought is to make sure you close all your div tags. It's easy enough to leave one open if you have lots of them! Second thought is that your inner divs will need to be smaller than your main div. You can specify this size as a percentage (of the main div) or a fixed value (but smaller than the main div), or just give the inner divs a right or left margin. Any of those should work. If none of them do, paste your stylesheet and your page source into a couple of files and let me see if I can spot the gremlin. (But it won't be till the weekend as I'm in KL at the moment on a biz trip for PCCW). Cheers, Martin. Sean, hi,

A div within a div within a div is absolutely possible, but you may need to specify width or margin parameters for the inner divs. Check out this page:

http://www.best-familyvacations.net/

… and look for the little beige box on the left of the main content area, just below the blue panel, that contains the links to ‘Cheap Flights, etc…’. That is actually a div within a div within a div within a div (4 levels).

The first div is the page div, which is my main container. Within that is the page-container div (illogical terminology, I know – it’s just my name for it! It’s the second div.). The difference in widths of those two divs, and the top and bottom margins of the page-container div, is how I create the white margin space round the outside of the content area (the bit which contains the header image, footer area, sidebar and the main content).

Within the page-container div is the content div, which is the main text area – i.e. excluding the sidebar, which is in its own div. And within the content div is that div which contains those links. Plus – all the images are in their own divs as well.

I’m not sure why your divs are breaking out, but first thought is to make sure you close all your div tags. It’s easy enough to leave one open if you have lots of them! Second thought is that your inner divs will need to be smaller than your main div.

You can specify this size as a percentage (of the main div) or a fixed value (but smaller than the main div), or just give the inner divs a right or left margin. Any of those should work.

If none of them do, paste your stylesheet and your page source into a couple of files and let me see if I can spot the gremlin. (But it won’t be till the weekend as I’m in KL at the moment on a biz trip for PCCW).

Cheers,

Martin.

]]> By: Sean http://www.wealthydragon.com/blog/2009/01/18/how-to-build-a-variable-width-website/comment-page-1/#comment-1667 Sean Mon, 19 Jan 2009 04:29:15 +0000 http://www.wealthydragon.com/blog/?p=358#comment-1667 Thanks for this tutorial Martin, it was very helpful. Is it possible to have an outer div, then have another outer div inside that ? ie a div in a div in a div ? I've been trying to get that to work but my 3rd div always breaks out of the first container div. I've resorted to changing my layout but I really prefer not to.... <abbr><em>Sean´s last blog post..<a href="http://www.theadsenseidiot.com/coding-design/a-great-firefox-plugin-measureit/" rel="nofollow">A great Firefox Plugin - MeasureIt</a></em></abbr> Thanks for this tutorial Martin, it was very helpful.

Is it possible to have an outer div, then have another outer div inside that ? ie a div in a div in a div ? I’ve been trying to get that to work but my 3rd div always breaks out of the first container div.

I’ve resorted to changing my layout but I really prefer not to….

Sean´s last blog post..A great Firefox Plugin – MeasureIt

]]> By: Posts about Wordpress as of January 18, 2009 | TUI's Voice http://www.wealthydragon.com/blog/2009/01/18/how-to-build-a-variable-width-website/comment-page-1/#comment-1658 Posts about Wordpress as of January 18, 2009 | TUI's Voice Sun, 18 Jan 2009 02:52:58 +0000 http://www.wealthydragon.com/blog/?p=358#comment-1658 [...] or higher Compatible up to: 2.7.0 Author Homepage &#187 Plugin Homepage » Genki Feedburner How to Build a Variable Width Website - wealthydragon.com 01/18/2009 Why would you want to build a variable-width website? Because the [...] [...] or higher Compatible up to: 2.7.0 Author Homepage &#187 Plugin Homepage » Genki Feedburner How to Build a Variable Width Website – wealthydragon.com 01/18/2009 Why would you want to build a variable-width website? Because the [...]

]]>