473,800 Members | 2,640 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

float: same column width..as page grows?

3 New Member
Is it possible to float left a few div elements so they stack left to right, but then have each "column" expand to the SAME length as the longest column? I am trying to make a border around a box that is made of background images, but the middle Section of divs need to expand to the same size as the middle div container since it holds the content of the page.

look at it like this

Div container
div div div (row 1)
div1 divX div2 (row 2) (div 1 and 2 need to match the height of divX (the div with the content)
div div div

That forms a box that can be "painted in with pics" to make a border

the thing is, is that the page may grow and shrink, so I can't just asign a specific px dimension, and I do not understand em as of yet...it has to grow and shrink according to how much content is in the middle div (divX).


in other words if I have three divs...1 for the right side, 1 for the middle (where content is) and one for the right side of the border....how do I get the left and right divs to MATCH the height of the middle div?

All three divs are inside a containing div.

Would it be smarter to turn them into < spans > and leave them contained in a div?

Or is this even possible? If not how are we suppose to seperate structure from layout without tables and still get the background to repeat-y in the left and right side of "imaged" border?
May 25 '07 #1
1 1664
drhowarddrfine
7,435 Recognized Expert Expert
Google for "faux columns" and see if that works for you.
May 25 '07 #2

Sign in to post your reply or Sign up for a free account.

Similar topics

2
23010
by: patrick h. | last post by:
Greetings, I am encountering some issues regarding using float while desiring to set the height to 100%. This is likely due to my own misunderstanding of the way things actually function -- any guidance would be appreciated. To summarize, I would like to have a variable-width, 100% height, left-floating column. However, it seems as though with Mozilla/Netscape that height: 100% is not interpreted as I would
5
4477
by: Matt Bostock | last post by:
Hi, I'm a bit of a CSS newbie so please accept my apologies if this post is inappropriate. I can't get the 'latest news' title to move across to the right column where it belongs. Here's a link to the page: http://www.retroweb.net/dev/8/ If anyone could help, I'd be extremely grateful.
2
5719
by: Dr. Richard E. Hawkins | last post by:
I've googled around, and asked everyone I know, but I still can't find any reference to anyone else having faced this particular IE bug with floats. I've put a page at http://dochawk.org/sample.html . This was made by stripping out the google ads from the regular pages. It validates as strict 4.01 at http://validator.w3.org. (The google ads drive it nuts!) The main (right) column is made with alternating left and right floats to...
1
2279
by: kpg | last post by:
Hi All, me again. I've got my web form data grid set up pretty nice. But how do you set the column width? The columns seem to grow and shrink based on the width of the data in them (that's ok) but if the data gets to long I get word wrap in the cell and the whole datagrid grows past the end of my page. I want to set fixed column width and prevent word wrap.
0
2052
by: jonipony | last post by:
HELP: Float Left box is drifting to the right in ie! -------------------------- I need som HELP with my CSS coding! On the following web page my design falls apart at screen size 800 x 600 (looks fine at larger screen sizes) when the left menu box that should float left is drifting to the right in Internet Explorer 6.0 (it doesn't drift to the right in Netscape 7.1).
2
2441
by: krsgoss | last post by:
I'm trying to do a two column "form" layout based on article here: http://www.alistapart.com/stories/practicalcss/ The idea is to have a label, and a value using definition list markup. I float the dt left, and the dd right with fixed widths for each. This works fine in both IE and FF until I have a <br> elements within the dd elements. IE does not clear subsequent dt's, and they are not floated beneath the multiline dd element,...
14
4993
by: Mark | last post by:
please view http://mnbayazit.com/misc/sample.gif i'm wondering how i can make the sidebar (green) float to the right of the main text, without specifying the width of the main content (because the sidebar is optional, i need the main content to fill the space available). ie, the green sidebar should be right up against the red header. code below
1
2728
by: impulsenine | last post by:
Hello all. I have yet another IE float drop challenge for you. I am aware that this comes up a lot, and I hope I'm not trying your patience by asking for help with it. The page has 3 columns, center is fluid ('holy grail' type layout). Float drop happens when an IE user shrinks the window width to <620px, when the far right column (a PHP include called 'indexfeatures') pushes the content (a DIV called 'maintextbox') down. What I want is...
2
2894
by: TonyV | last post by:
Okay, this is driving me nuts, and while I'm still researching, I'm hoping someone here can help. I'm trying to create a simple page with a navigation menu on the left side of the main content area. On the right side, I have a content div that contains an h1 title and a table that I'd like to take up the full width of the div (but not, of course, run over the navigation menu). So I try something like this in my CSS:
0
9690
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look ! Part I. Meaning of...
0
9550
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
1
10250
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
0
10032
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
1
7574
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
0
6811
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
0
5469
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
1
4149
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
3
2944
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.