Two questions: CSS layout and javascript

[Perseus]

Greetings.

My homepage contains two columns, one with a beige background (around 400px in width) that contains the body text, etc, and a second column (around 150px in width). This second column will have a greenish background, however I want it to be as long as the first column. I did NOT apply a height to the first column. I want to be able to add paragraphs whenever (which will make the first column longer), and in so doing, this will automatically make the second column as long as the first one, even though there is no content in the second column. How do I do this? I tried putting the div for the second column within the div for the first column, but so far this has not worked.

My second issue is: I have several images that load randomly, using javascript. However there are people who turn off javascript. SO how do I place a static image there in place in case someone turns of the javascript?

Thanks!

 

[Nummi_G4]

Are you using the float attribute or positioning for your layout?

 

[Perseus]

positioning

 

[mdnky]

Wrap your 2 main divs in a container div with a background image. While you're at it, you might want to consider dropping the 'positioning' and use a float instead. Below are some quickies I did to show the idea behind it. You can adopt the same principles with positioned elements (to a degree), I just prefer floats for simplicity's sake.

• Example 1: Blocks only
• Example 2: Shows Blocks (content, nav) and BG image on container
• Example 3: Shows final

 

[texanpenguin]

Perseus - as for your second issue, it couldn't be easier.

In your code, where the image belongs, put your <img> tag, with a "name" property (so you can refer to it from JS) and a "src" property declaring the initial value. Don't forget to close the tag.

So that's:

<img name="myImage" src="./images/myImage.jpg" alt="My Image" />

Then your JS will just have the random number generator, and the last line will be something along the lines of:

document.myImage.src = imageArray(selectedImage);