Thanks Benjamin. I'll see if that helps. Unfortunately, that client just up
and decided out of the blue to stop work on all projects for about a months
time, so who knows when (if) I'll get back to it. :o(
Chris
On 7/26/07, Benjamin Sterling <[EMAIL PROTECTED]> wrote:
Chris, with out actually seeing in action, my assumption is that you have
the height set to 413px and do not specify a overflow to either hidden, auto
or scroll and the assumption is that as some point the box is being forced
taller and not resizing after there is smaller inner content. I would
suggest taking out the paddings and adding them back in till you see the
issue. Sadly, IE has known box issues so, you will need to adjust your
math, height + paddingTop + paddingBottom, to suit.
Hope this points you in the right direction.
On 7/26/07, Christopher Jordan <[EMAIL PROTECTED] > wrote:
>
> Hi folks,
>
> I'm having trouble with a bit of jQuery/CSS stuff, and I'm hoping
> someone here could explain what the heck I'm doing wrong. I am not by any
> stretch a CSS guy. I do what I can to get by. Also (and I know this sticks
> in lots of people's craw), this only *has to* work in IE. This is an
> internal app for a company who does not use FF or any other browser.
>
> I've got the following in my main index file:
>
> <script src="/Include/JS/jquery.js"></script>
> <script>
> $(function(){
> $(".ActionSelection").bind("mouseover",function(){
> $(this).addClass("Underlined");
> $(this).addClass("ActiveLinkColor");
> }).bind("mouseout",function(){
> $(this).removeClass("Underlined");
> $(this).removeClass("ActiveLinkColor");
> }).bind("click",function(){
> DisplayScreen($(this).attr("method"));
> });
> });
> ...
> </script>
>
> then...
> <body>
> <div class="MainWrapper"> <!--- This creates the border and
> colors that we're used to on our submodals --->
> <div class="LeftPanel">
> <div class="ActionHeader">Add New</div>
> <div class="ActionSelection"
> method="displayAddCancelCode">Cancel Code</div>
> <div class="ActionSelection"
> method="displayAddCancelReason">Cancellation Reason</div>
> <br>
> <div class="ActionHeader">Edit/Delete</div>
> <div class="ActionSelection"
> method="displayEditCancelCode">Cancel Code</div>
> <div class="ActionSelection"
> method="displayEditCancelReason">Cancellation Reason</div>
> </div>
> <div class="RightPanel">
> <div class="StatusBar"></div>
> <div class="RightPanelContent"></div>
> </div>
> </div>
> </body>
>
>
> The relevant CSS is: (don't mind the #someVar# it's a ColdFusion thing.
> Those are evaluated to actual colors before they hit the browser)
> div.MainWrapper{
> height : 413px;
> width : 100%;
> margin : 2px 0px 0px 0px;
> padding : 3px;
> border : 3px solid
> #ThisMasterConsoleTableBorderColor#;
> background-color: #ThisMasterConsoleTableBackgroundColor#;
> }
> div.LeftPanel{
> float : left;
> border-right : 1px solid #ThisMasterConsoleTableBorderColor#;
> width : 150px;
> height : 400px;
> }
> div.RightPanel{
> float : right;
> border : 1px dashed ##A0A0A0;
> width : 400px;
> height : 400px;
> }
> div.StatusBar{
> color : ##A0A0A0;
> font-weight : bold;
> width : 100%;
> height : 15px;
> border-bottom : 1px dashed ##A0A0A0;
> text-align : right;
> }
>
> /* Generic Classes */
> .ActionHeader{
> font-weight : bold;
> color : #ThisMasterConsoleHeaderTextColor#;
> background-color: #ThisMasterConsoleHeaderBackgroundColor#;
> padding : 3px;
> margin-right : 3px;
> cursor : default;
> }
> .ActionSelection{
> padding-left: 5px;
> cursor : pointer;
> }
> .Underlined{
> text-decoration: underline;
> }
> .ActiveLinkColor{
> color: green;
> }
>
> Okay, so I've got a nice box with a three pixel border around it and it
> sits in a browser window sized just right leaving a two-pixel space between
> the edge of the window and the three pixel border. When I mouseover one of
> the ActionSelection divs the text contained within dutifully underlines and
> changes color. However, the MainWrapper also seems to get two pixels taller
> leaving me with a three pixel border on the top, left and right and a one
> pixel border on the bottom! :o( The two pixel margin between the browser
> window's bottom edge and that one remaining pixel of the bottom three pixel
> border however, remains unchanged.
>
> I can attach some before and after screen shots if that would help.
> Unfortunately, the code resides behind a firewall, and is not accessible to
> the public. :o(
>
> Can anyone help me, please?
>
> Many Thanks,
> Chris
>
> --
> http://cjordan.us
--
Benjamin Sterling
http://www.KenzoMedia.com <http://www.kenzomedia.com/>
http://www.KenzoHosting.com <http://www.kenzohosting.com/>
--
http://cjordan.us
