Ok--I am baffled. I have a page www.sunsart.net that isn't always consistent. I am trying to have a 10px margin to the left of the picture of Sun. Sometimes it's there..sometimes it's not. Try clicking on a different button and then going back to "about"---what is causing this. I need the 10 px gap there.

Here's my styling:

body {
    font-family: sans-serif;
    margin: 0;
    margin-top:5px;
    padding: 0;
    background: url(site_images/back.jpg) center;
    background-repeat: repeat-y;

}

h1, h6 {
    margin: 0;
    font-weight: normal;
}

div#main {

    width:800px;
    margin-left:auto;
    margin-right:auto;

}

div#header {
    border:2px solid black;
    margin-bottom:5px;
    font-size:0;
}

div#aboutbutton {
    border: 2px solid black;
    float:left;
    font-size:0;
    margin-bottom:-59px;
}

div#exhibitbutton {
    border-top: 2px solid black;
    border-bottom: 2px solid black;
    float:left;
    font-size:0;
    margin-bottom:-59px;
}

div#awardsbutton {
    border: 2px solid black;
    float:left;
    font-size:0;
    margin-bottom:-59px;
}

div#artbutton {
    border-top: 2px solid black;
    border-bottom: 2px solid black;
    border-right: 2px solid black;
    float:left;
    font-size:0;
    margin-bottom:-59px;
}

div#container {
        position:relative;
    margin-top:58px;
        border-left: 2px solid black;
        border-right: 2px solid black;
        border-bottom: 1px solid black;
        border-top: 1px solid black;
}

div#footer
{
    background:white;
    border-bottom: 2px solid black;
    border-left: 2px solid black;
    border-right: 2px solid black;
    border-top: 1px solid black;
    padding:10px;

}

div#test {
    font: arial;
}

div#addpicturesbutton
{
    border: 2px solid black;
    float:left;
    font-size:0;
    margin-bottom:-59px
}

div#addshowbutton
{
    border-top: 2px solid black;
    border-bottom: 2px solid black;
    float:left;
    font-size:0;
    margin-bottom:-59px
}

div#addawardsbutton
{
    border: 2px solid black;
    float:left;
    clear:right;
    font-size:0;
    margin-bottom:-59px
}

div#sunpic
{
    position:relative;
    margin-top:10px;
    margin-right:10px;
    float:left;
    width:310;
    margin-left:110px;
    border:2px solid black;
    font-size:0;
    background:purple;
}

div#abouttext
{
    margin:10px;
    font-family: sans-serif;

}


div#showsright
{
    margin-left:435px;
    padding:10px;
    min-height:300px;
}

div#awardleft
{
    margin-top:10px;
    margin-left:10px;
    }

div#awardright
{
    position:absolute;
    top:0;
    bottom:0;
    width:400px;
    margin-left:430px;
    min-height:735px;
    padding-top:9px;
}


#login
{
    background:white;
    border-right:2px solid black;
}

.absolute
{
    position: absolute;
    top:50px;
    left:50px;
    background-color: #5795df;
    width: 320px;
    border:double 2px black;
    text-align:center;
}

.MyView
{
    border-color: Blue;
}



.MyView td
{
    border-color: Blue;
}

div#main2
{
    width:800px;
    margin-left:auto;
    margin-right:auto;
    position:relative;
}


THANKS!!!
Rob

I tried working on this, but I'm not very convinced about my results without having all the images in the layout. Try adding padding-left:10px; to #container, and see if that fixes the problem.

Two other quick notes.

You have FF problem when I look at it; the floated button images are piling up on top of each other, the yellow art gallery is the only one I'm seeing. Works fine in IE. I spent most of my time on this and still haven't come up with a good solution, but again, I don't have the full layout. Try setting their display:block, display:inline, and play with position. That would be a good place to start.

I'm assuming the viewstate is for the login information. I'm security cautious, but I prefer not to have a viewstate recording security information. If this were my page, I'd set the viewstate to false, but that's me.

-------------------------

Whatever you can do or dream you can, begin it. Boldness has genius, power and magic in it. Begin it now.
-Johann von Goethe

When Two Hearts Race... Both Win.
-Dove Chocolate Wrapper

Chroniclemaster1, Founder of www.EarthChronicle.com
A Growing History of our Planet, by our Planet, for our Planet.

Not sure what viewstate is being used for---but it's nothing i did--I assume it deals with ASP.NET 2.0 and how it handles membership?

As to padding...tried that. I tried margin-right on container..padding...etc.

What's weird is it will work sometimes..and sometimes not.

I'm dumbfounded.

-Rob

Hi there,

ViewState is ASP.NET's mechanism to maintain state across postbacks. It usually doesn't contain sensitive data (unless you put it there) but it contains state information about the page when it first loaded.

Usually, ViewState is a good thing, although it adds considerably yo the size of the page. Reading the first few pages of results from this Google search:

http://www.google.com/search?hl=en&q=viewstate+minimize

should give you a good idea about what ViewState is, and how to minimize it.

Cheers,

Imar

---------------------------------------
Imar Spaanjaars
http://Imar.Spaanjaars.Com
Everyone is unique, except for me.
Author of ASP.NET 2.0 Instant Results and Beginning Dreamweaver MX / MX 2004
Want to be my colleague? Then check out this post.

Rob,

Unfortunately, this is the way it usually works with web stuff. With all the different browsers out there and their inconsistent adherence to the HTML standards, you get various results. Unless you know or have some control over the browser used to view the site you are going to have to stick to well adhered to standards or simpler layouts that will be flexible so they don't go terribly wrong across browsers.

In particular, I have found that the "float" css property doesn't work consistently enough to use reliably.

In your case I'd recommend using a simple table to lay out the image menu instead of the CSS. This will be far more consistent between browsers.

-Peter

another option would be to layout the buttons with position:absolute, and define a top:XXXpx to clear the header and layout each button with a left:XXXpx that sets each one next to the previous button.

-------------------------

Whatever you can do or dream you can, begin it. Boldness has genius, power and magic in it. Begin it now.
-Johann von Goethe

When Two Hearts Race... Both Win.
-Dove Chocolate Wrapper

Chroniclemaster1, Founder of www.EarthChronicle.com
A Growing History of our Planet, by our Planet, for our Planet.