This is more of a WP question that it is a BP question, but anyway….

We have always had a fixed layout and now have more than 2000 blog posts. We would like to switch to a fluid dynamic layout (like BP 1.5 default). I was wondering if anyone had any ideas on what to do about all our old content (embeds, images, etc.) that now may be too wide for smaller screens.

With the images we could set the width to 100%, but a bigger concern is all the embeds/iframes (pre WP 2.9). Is there a way other than individually editing each post to edit the fixed width to make it fluid?

[@karmatosed Moderator 13 years, 3 months ago]

It’s really a case of doing a test site with your data and seeing if possible. In theory if your theme supports floats and so on it will fall ok. The issues usually are scaling down not up.

The ‘issues’ come with as you say embedding and images set to before be the full width of the content area. 100% can overcome this in some respects but you shouldn’t go ‘above’ what you have already for obvious reasons (a 700px wide image is it’s correct largest size).

If you are going for responsive then you should be going with max-width:100% on all images with or without floats. Video more or less will be a set size that’s just something without scripting you will have to live with or you can look at html5 video and scripting solutions / plugins. For smaller thumbnail images you can even do small fixed sizes or % again.

A few links around responsive images:
https://github.com/filamentgroup/Responsive-Images
http://adaptive-images.com/

Some more general ones for responsive design:
http://coding.smashingmagazine.com/2011/01/12/guidelines-for-responsive-web-design/
http://stuffandnonsense.co.uk/projects/320andup/
http://www.smashingmagazine.com/2011/07/22/responsive-web-design-techniques-tools-and-design-strategies/

The key though in moving into a ‘responsive’ or more fluid layout is thinking not in terms of pixel precision but a more flexible outlook to the theme.

Personally my approach to the older content would probably be get it looking acceptable but don’t worry about going up in width just worry about if goes lower maybe setting up some media queries to catch things.

[@fiq Member 13 years, 3 months ago]

Yes, moving down in size is the tricky part.

It would be nice if there was a database script that looked for embeds and iframes and striped everything away except for the link which should then embed on its own post WP 2.9.

Perhaps there may be a solution here:

http://css-tricks.com/7066-fluid-width-youtube-videos/