Programming C, C++, Java, PHP, Ruby, Turing, VB
Computer Science Canada 
Programming C, C++, Java, PHP, Ruby, Turing, VB  

Username:   Password: 
 RegisterRegister   
 [ Problem 2 ] Can't seems to get the right position
Index -> Graphics and Design, Web Design -> (X)HTML Help
View previous topic Printable versionDownload TopicSubscribe to this topicPrivate MessagesRefresh page View next topic
Author Message
Amailer




PostPosted: Mon Jan 10, 2005 4:00 pm   Post subject: [ Problem 2 ] Can't seems to get the right position

Hey

I'm trying to position the menu in the center gap of a white spacing between the header and the content box (or the gap in the outter box ), I managed to get it to look right on firefox but it doesn't seem to be displaying the same way on IE... the menu is moved up on IE by about 10px and I can't get it to look the same as firefox without distorting the firefox layout or w/e, any ideas on how to fix this?

http://amailer.sourceforge.net is the site and the code for the um menu part is

css:

.menu_first{
    position: absolute;
    right: 59px;
    top: 23px;
}

.menu_first a {
    color: #FFFFFF;
    font-size: 11px;
    padding-left : 10px;
    padding-right : 10px;
    border-left : 1px solid #FFFFFF;
    border-right : 1px solid #FFFFFF;
    margin-left:2px;
    padding-top: 2px;
    padding-bottom: 2px;
}

.menu_first a:visited,.menu_first a:link {
    color: #FFFFFF;
    background : url("../images/menu_bg.gif") no-repeat;
    background-position : 100% 0%;
}
.menu_first a:hover {
    color: #FFFFFF;
    text-decoration: none;
    background : url("../images/menu_bg.gif") no-repeat;
    background-position : 100% 100%;
}


If you want to see the way its suppose to be, view it on firefox-- and the way it isn't suppose to be view it on IE.

Thanks

Solved
Catalyst wrote:
To solve that problem you could change the outer box to position relative
code:

#outer_box{
    width: 90%;
   padding: 2px 10px 10px 10px;
   margin: 10px 0px 0px 0px;
    margin-left: auto;
    margin-right: auto;
   background-color:#FFFFFF;
   position:relative;
}

that way all of the elements inside of it, when positioned absolutely, will positioned relative to #outer_box, not the screen. This seems to elimination any browser differences between IE and FF. Your number need to be changed a bit tho. These work:
code:

.menu_first{
    position: absolute;
   right: 30px;
   top: 15px;
}
Sponsor
Sponsor
Sponsor
sponsor
Amailer




PostPosted: Tue Jan 11, 2005 5:17 pm   Post subject: (No subject)

Ah, new problem... you see that welcome box at the side?
Well if i add mroe text to it, it goes out of the blue shade it is over and into the white, the blue shade for some odd reason just won't change its height with the length of the welcome box inside it!

Any ideas how to fix this???
i think its the same thing what Catalyst said but i'm not sure how to fix this one, i tried swtichign things around but I can't get it to work without having the white background not having 100% height.. or w/e
btw, to see what i mean click the news button on IE, but don't forget that this happnes on firefox also :S just for some odd reason the set width works on firefox and not on IE, but if i add more text to the welcome-- that dammmmmm problem tkaes place
Amailer




PostPosted: Wed Jan 12, 2005 5:42 pm   Post subject: (No subject)

*BUMP*
Display posts from previous:   
   Index -> Graphics and Design, Web Design -> (X)HTML Help
View previous topic Tell A FriendPrintable versionDownload TopicSubscribe to this topicPrivate MessagesRefresh page View next topic

Page 1 of 1  [ 3 Posts ]
Jump to:   


Style:  
Search: