Rahul Gonsalves wrote:
> http://rathehun.beplaced.com/
>
> Problem 1:
>
> Vertical image centreing. The logo in the top left hand
> corner needs to be centred in the orange box.
For that centering method to work, the wraptocenter div should have the
dimensions of the space where you want your image centered, not the
dimensions of the image. So you need something like:
.wraptocenter {
height: 175px;
width: 175px;
}
> Problem 2:
>
> When one hovers over one of the links in the left navigation
> bar, it is highlighted, using a lightish background. How does one
> extend the background, to make it one universal width,
Give your links display:block
.links a {
display: block;
}
And if you want to have the whole rectangular zone clickable in IE/Win you
should also add the Holly hack:
/*\*/
* html .links a {
height: 1px;
}
/**/
> Problem 3:
>
> If you look at " Landscaping" " Vardenahalli Interaction"
> etc, I've used
> <br /> tags to space them out so that they look like they're in a
> straight line. I can't seem to think of how to do this using
> padding, as the text lengths are different.
That's the most difficult one. The <br/>s do not fully solve the problem: if
you change the text size so that lines wrap differently the alignment is
lost.
A solution is to define four separate divs, two floated left, and two not
floated or floated right, and put a clearing element after the first two, so
to guarantee your desired alignment. Something like this:
- news1 (Excursions), floated left
- news2 (Mela), floated right
- clearing element
- news3 (Landscaping), floated left
- news4 (Varadenahalli Interaction), floated right
I haven't looked at the details, you can implement this in many variations.
Hope this helps a little,
Bruno
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
