After grappling with this a couple of days, I could use your help. I have a page I created that I need to make a couple of minor object adjustments. I want to center the flash clock under the rotating photos and move it up so that it does not block the blue shadow. Also, I want to make the "skat news and updates" box below a single box with the news items left justified. Whenever I try to make these adjustments, causes everything else to shift around. Any suggestions on fixing this would be appreciated.
See if you're okay with this:
If you are, then what was wrong was that you had re-used floatRT class for almost every element. I guess that class is initially for the Route map & Fares and passes?
Change that to:
Add to CSS:
float: left; width: 350px; left: 10%; top: -7px; position: relative;
Bottom area (skat news):
Line 337 - 343:
<!--end .floatLT --></div>
Remove the lines I've struck off (ideally removing the left floated div with a non breaking space character within <h3>.
Add to CSS:
So now, your Line 337 will become:
<h3>skat News and Updates</h3>
Another observation, the link colors in 'Skat News...' section is green - making it very difficult to read.
You may want to change it to a lighter color to suit the background. Maybe the same green you've used as your skat news heading background: #ABD372?
Trust this helps.
Yes, your screenshot is exactly what I am trying to do!
I tried it twice following your instructions to the letter, but ended up with the following each time:
This looks familiar!
Anyway, you have a critical code error that needs attention.
You're missing a closing </div> for your container.
Add </div> immediately after <!--end sidebar-->
That should fix your alignment issue.
Also, the same line, you have a redundant </span>. It is from before. We're not using that <span> markup now. Remove that.
The color for 'subcontent' area:
In the CSS for #subcontent:
EDIT: To instruct on removing </span> tag