Date: 08/27/07 (WebDesign)    Keywords: php, css

I've been working on my electronic press kit: http://amyhsieh.com/index.php?page=press

There's just one thing that I can't get to work, and if you click on the link, it should be pretty obvious: the lines that go under the headings go through the picture on the right. Here is the CSS: http://amyhsieh.com/styles/main.css - the revelant stuff is towards the end of the file, in p.sectionhead and div.rightimage.

Any suggestions? I'm trying to avoid tables, but I don't think that would be a good solution anyway because I want the content to go around the picture, IOW stay on the left of the picture and then when it gets to the bottom of the picture, go all the way across, under the picture. Basically exactly like it does now, but without those lines going all the way through.

Also, if anyone wants to critique the site in general (http://www.amyhsieh.com), that would of course be welcome as well. (FYI, I have deliberately disabled the "about" link in the menu, temporarily.) And as long as I'm posting about that, there was something else I was wondering about.



On the main page (http://www.amyhsieh.com), the main content is split into two columns. I really don't like the way I ended up writing this in CSS: each column is in its own DIV with its own class, and I fixed the height and position of both of them. That means that the background color will not stretch to fit more content; if I added another upcoming show for instance, that show would go off the end of the blue-purple background and onto the next thing.

I have been working with CSS for years now, and am still very puzzled about how to do multiple columns. Ideally, I would like both the left (blue-purple) and right (white) sections to behave as sort of one entity; whichever has the lengthier content, both columns would be set to the appropriate height to accomodate that. (Like how the height of a row is determined, in a table.) I feel like there should be a good way to do this using only CSS, particularly because I did try using tables to do this, and could not get it to look right at all. (It was a while ago, but IIRC, my big problem was the borders of the table -- I couldn't get the clean, borderless edges that I have now.)

Well, I think I've rambled enough. Again, the CSS for this page is here: http://amyhsieh.com/styles/main.css


Thanks in advance for any help you can provide.

Source: http://community.livejournal.com/webdesign/1301996.html