The site I am developing is only my third site. It is the first site
in which I am using percentages so that the text and images expand
and contract when zooming in and out. I am trying to "perfect" the
home page to use as a model for the other pages so the links are not
yet active and the content is primarily placeholders.
Both the markup and css validate but two significant problems and
several minor problems are apparent when viewing the site using
Firefox and Safari. I am hoping that someone can help me find
solutions.
1. When the width of the content exceeds the size of the window,
either because of zooming in or resizing the window, the right column
moves down under the left sidebar. I want the columns to retain their
positions and a horizontal scroll bar to appear at the bottom of the
window. I tried adding an overflow statement but perhaps I did it
wrong or placed it in the wrong place.
2. The same phenomenon occurs when the window is resized to
become quite narrow. I tried specifying a min-width for the wrapper,
container and mainContent divs but the problem persists.
The site can be viewed at:
http://academyofleisuresciences.com/alsDev/index.html
The css can be viewed at:
http://academyofleisuresciences.com/alsDev/css/main.css
Another factor that adds to my confusion is an inconsistency in
producing these results. When I use the Dreamweaver "preview in ..."
function to view this site in Firefox or Safari the problems are much
more pronounced than when I view them directly through the browsers.
For example, the links in the left sidebar should be blue. They are
when viewed directly but when I view them using the Dreamweaver
preview function they are white. It is as if the styling of the links
in the footer has overridden the styling of the links in the sidebar.
There are also a number of minor but unsightly alignment problems
with the header and footer. When zooming in and out at certain sizes
The right sides of the elements become slightly miss-aligned. All
have a maximum width of 100% so I cannot figure out what is causing
that to occur.
A thin line becomes visible between the styled top of the navigation
and footer graphics and the navigation and footer divs.
Finally, I would like the top (blue) border above the leftSidebar div
to end above the F in "Fellow Nominations Due" and the end of the
border above the mainContent div to align with the right side of the
image of the ALS President.
I would greatly appreciate help in solving these problems. I am on
digest so please cc me directly on any messages you send.
--
Tony
Tony Tinsley
425.493.6833
howard.tins...@frontier.com
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/