Layout : HTML/Image Problem

Timewell posted this at 19:48 — 16th May 2004.

Joined: Jun 2002

Hi there

I wonder if you could somehow help me out with my layout problem. Basically, I've designed a site with a mate and it looks like :

http://www.cmdirector.neosurge.net/WCM/index.html

It has now been decided that the layout needs changing to make more use of the space but I've just realised that we've designed it so that it cannot be manipulated as easily as first thought. You will see 3 blank box where a button and an image used to be - I would like to move the text ("lorem ipsum etc" and the copyright) up into these spaces without causing the layout to change.

I'm not too hopeful but I'd be most grateful if you could help.

Many thanks!

no1golfpro.co.uk - High quality golf equipment at competitive prices.

Busy posted this at 21:39 — 16th May 2004.

He has: 6,151 posts

Joined: May 2001

If you had used seperate tables, the trick is to give each table border a different colour to find the one you need (don't forget to remove these afterwards - only works on IE)

Since you only have one table, turn your table border to 1 (border="1") now guess where you think the td cell is, find a td cell and type BOO save/reload page, keep doing this to every td tag until the "BOO" is displayed in the right td section, remove it from last place tried first, so you only ever have the code in your page once.
But what makes this one real easy is you actually have an image beside the section you want to go into

The easier way would be to just open it up in a WYSIWYG editor and move stuff around (you dont learn anything this way thou)

Megan posted this at 13:28 — 17th May 2004.

She has: 11,421 posts

Joined: Jun 1999

Actually, you could learn something if you watch the code at the same time

You want to replace the white boxes with the text? I don't understand why you're having a problem. Oh, okay, I'm starting to see now. The images called index_20a.jpg are making those green columns. The white is just the background showing through. Try putting the text into the cell with those green backgrounds. I'm not entirely sure how this layout is working but that might do the trick.

However, I don't think this is the best way to code this layout. Instead of using images for those green areas, use a background colour instead. Your dotted lines can be done with css. Everything can be done with css

There are also a lot of white boxes showing all over the place in Opera. I'm not sure why - it could be your spacer.gif's.

While I'm here, I should say that this layout is a big improvement over some of the ones you have posted in the past. Good work!

Megan
Connect with us on Facebook!

Timewell posted this at 12:17 — 18th May 2004.

They have: 344 posts

Joined: Jun 2002

Hi guys,

Many thanks for your help. Basically, I think the best solution for me is to rebuild the design without so many graphics. I've made a start on this and it is coming along nicely now.

Do you have any suggestions for a rollover code? The one I'm using at the moment is:

<A HREF="../index.php">
<img src="images/homeup.jpg" 
onMouseOver="home.src='images/homeover.jpg'" 
onMouseOut="home.src='images/homeup.jpg'" width="226" height="26" 
alt="home" border="0" />
</A>

But it does not seem to be working for some reason. I've got it inside a cell, so I do not know if that is the problem?

Megan - thanks for the compliments. I thought it to be a huge improvement on my previous designs as well - but I've still got a long way to go, I'm yet to validate the code.

Busy - thanks for that! I'll remember it if I ever get stuck like this again. I had started to do what you said but it was going to take ages, and so I decided to recode.

Once again, thanks for your help! I cannot say how grateful I am.

no1golfpro.co.uk - High quality golf equipment at competitive prices.

Renegade posted this at 20:14 — 18th May 2004.