Opera CSS

Discussion in 'CSS' started by ProductivePC, Nov 8, 2006.

  1. #1
    Hello,

    I don't see many Opera browsers passing in our logs so this is not a huge deal however it just bugs me to know that in every other browser, everything looks fantastic however in Opera.... yet once again... it does not.

    I am wondering if someone can point me in the right direction or tell me what the issue is as I am at a loss currently.

    Let me clarify that statement. I know why this is happening. I just don't know what to do to fix it.

    Here is the webpage:
    howard.worldfamousgiftbaskets.com/border.html

    The borders look good in the following browsers
    IE 6.0
    AOL Explorer
    Netscape 8.2
    Firefox 2.0

    The border is incorrect in the latest version of Opera and I am sure all previouis versions. The line that is the culprit is the class .outer-border with a width of 706px;

    If I make it bigger to suffice Opera then Firefox and Netscape go to hell.

    Is there a work-around for this or a better way to write that line?

    Thanks,
     
    ProductivePC, Nov 8, 2006 IP
  2. ProductivePC

    ProductivePC Peon

    Messages:
    362
    Likes Received:
    6
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Shawn,

    This place sure has changed...
    A year ago this place was filled with people and your questions wouldn't go 1 hour without being answered less 3 days.

    This is the 2nd or 3rd question I have placed with no help in this forum.

    Anyway,

    I did find a hack for opera that did fix the issue however I would like to know if there is something else that is not a hack that will fix the issue.

    
    /* The next part is here for Opera only. 
    Explanation: http://virtuelvis.com/archives/2004/01/css-for-opera-7 
    Start Opera Media Hack 
    */ 
    [FONT=verdana][SIZE=2][COLOR=#000000]@media all and (min-width: 0px)[/COLOR][/SIZE][/FONT]
    [FONT=verdana][SIZE=2][COLOR=#000000]{ [/COLOR][/SIZE][/FONT]
    [FONT=verdana][SIZE=2][COLOR=#000000].outer-border [/COLOR][/SIZE][/FONT]
    [SIZE=2][FONT=verdana][COLOR=#000000]{ [/COLOR][/FONT][/SIZE]
    [SIZE=2][FONT=verdana][COLOR=#000000]width: 713px; [/COLOR][/FONT][/SIZE]
    [SIZE=2][FONT=verdana][COLOR=#000000]height: auto; [/COLOR][/FONT][/SIZE]
    [SIZE=2][FONT=verdana][COLOR=#000000]border: double #e5beff thick; [/COLOR][/FONT][/SIZE]
    [SIZE=2][FONT=verdana][COLOR=#000000]padding: 2px; [/COLOR][/FONT][/SIZE]
    [SIZE=2][FONT=verdana][COLOR=#000000]} [/COLOR][/FONT][/SIZE]
    [SIZE=2][FONT=verdana][COLOR=#000000]} [/COLOR][/FONT][/SIZE]
    [SIZE=2][FONT=verdana][COLOR=#000000]/* End Opera Media Hack */ [/COLOR][/FONT][/SIZE]
    
    Code (markup):
     
    ProductivePC, Nov 8, 2006 IP