Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Nov 2009
    Location
    All around Europe
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Opera,IE7 menu problems heading tags and position

    Hi all,
    Congratulation for the grate forum, this is my first topic.

    I trying to put in my gallery left menu but having some problems with IE7 and Opera browsers.

    Problem with IE7 is with the background color (should be transparent) but appear blue and the menu text is centered, must be possition left.

    With Opera the problem is silimar, the text is centered.
    This is my style.css file and theme.php if somebody want to help me

    style.css

    Code:
    /* Colors used:                                */
    /* --------------------------------------------*/
    /* Hex 000000 = RGB   0,  0,  0 = black        */
    /* Hex 5F5F5F = RGB  95, 95, 95 = light black  */
    /* Hex BDBEBD = RGB 189,190,189 = dark grey    */
    /* Hex D1D7DC = RGB 209,215,220 = medium grey  */
    /* Hex CCD7E0 = RGB 204,215,224 = light grey   */
    /* Hex CBD7DE = RGB 203,215,222 = steel grey   */
    /* Hex F2F5F7 = RGB 242,245,247 = dark white   */
    /* Hex EFEFEF = RGB 239,239,239 = dark white   */
    /* Hex FFFFFF = RGB 255,255,255 = white        */
    /* Hex 000666 = RGB   0,  6,102 = dark blue    */
    /* Hex 0033CC = RBG   0, 91,104 = medium blue  */
    /* Hex 718EA5 = RGB 113,142,165 = light blue   */
    /* Hex 8AA5B5 = RGB 138,165,181 = light blue   */
    /* if you don't like a color, just do a search */
    /* and replace on the hex color...             */
    
    body {
            background: url("images/bg.gif");
            background-color: #F2F5F7;
            font-family: "Trebuchet MS", Verdana, Geneva, Arial, sans-serif;
            font-size : 12px;
            color: #000666;
            margin: 0px;
    }
    
    table {
            font-size : 12px;
    }
    
    h1{
            font-weight: normal;
            font-size: 21px;
            font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
            text-decoration: none;
            line-height : 80%;
            color: #FFFFFF;
            background: #718EA5;
            margin: 1px;
    }
    
    h2 {
            font-family: Arial, Helvetica, sans-serif;
            background-image : url(images/box_left_icon.gif);
            background-repeat : no-repeat;
            background-position : left;
            padding-left : 18px;
            font-size: 18px;
            margin: 0px;
    }
    
    h3 {
            font-weight: normal;
            font-family: "Trebuchet MS", Verdana, Geneva, Arial, sans-serif;
            font-size: 12px;
            margin: 2px;
    }
    
    p {
            font-family: Arial, Helvetica, sans-serif;
            font-size: 100%;
            margin: 2px 0px;
    }
    
    ul {
            margin-left: 5px;
            padding: 0px;
    }
    
    li {
            margin-left: 10px;
            margin-top: 4px;
            margin-bottom: 4px;
            padding: 0px;
            list-style-position: outside;
            list-style-type: disc;
    }
    
    .textinput {
            font-family: "Trebuchet MS", Verdana, Geneva, Arial, sans-serif;
            font-size: 100%;
            border: 1px solid #D1D7DC;
            padding-right: 3px;
            padding-left: 3px;
    }
    
    .listbox {
            font-family: "Trebuchet MS", Verdana, Geneva, Arial, sans-serif;
            font-size: 100%;
            border: 1px solid #D1D7DC;
            vertical-align : middle;
    }
    
    .button {
            font-family: Arial, Helvetica, sans-serif;
            font-size: 100%;
            border: 1px solid #CCD7E0;
            background-image : url(images/button_bg.gif);
            background-position : bottom;
    }
    
    .comment_button {
            font-family: Arial, Helvetica, sans-serif;
            font-size: 100%;
            border: 1px solid #CCD7E0;
            background-image : url(images/button_bg.gif);
            background-position : bottom;
            padding-left: 3px;
            padding-right: 3px;
    }
    
    .radio {
            font-family: "Trebuchet MS", Verdana, Geneva, Arial, sans-serif;
            font-size: 100%;
            vertical-align : middle;
    }
    
    .checkbox {
            font-family: "Trebuchet MS", Verdana, Geneva, Arial, sans-serif;
            font-size: 100%;
            vertical-align : middle;
    }
    
    a {
            color: #0033CC;
            text-decoration: none;
    }
    
    a:hover {
            color: #0033CC;
            text-decoration: underline;
    }
    
    .bblink a {
            color: #0033CC;
            text-decoration: none;
    }
    
    .bblink a:hover {
            color: #0033CC;
            text-decoration: underline;
    }
    
    .maintable {
            border: 1px solid #CCD7E0;
            background-color: #FFFFFF;
            margin-top: 1px;
            margin-bottom: 1px;
    }
    
    .tableh1 {
            font-family:  Verdana, Geneva, Arial, sans-serif;
            background : #8AA5B5 ;
            color: #FFFFFF;
            padding-top: 3px;
            padding-right: 10px;
            padding-bottom: 3px;
            padding-left: 10px;
    }
    
    .tableh1_compact {
            font-family:  Verdana, Geneva, Arial, sans-serif;
            background : #8AA5B5 ;
            color: #FFFFFF;
            padding-top: 2px;
            padding-right: 5px;
            padding-bottom: 2px;
            padding-left: 5px;
    }
    
    .tableh2 {
            background: #CBD7DE ;
            color : #000000;
            padding-top: 3px;
            padding-right: 10px;
            padding-bottom: 3px;
            padding-left: 10px;
    }
    
    .tableh2_compact {
            background: #CBD7DE ;
            color : #000000;
            padding-top: 2px;
            padding-right: 5px;
            padding-bottom: 2px;
            padding-left: 5px;
    }
    
    .tableb {
            background: #F2F5F7 ;
            padding-top: 3px;
            padding-right: 10px;
            padding-bottom: 3px;
            padding-left: 10px;
    }
    
    .tableb_compact {
            background: #F2F5F7 ;
            padding-top: 2px;
            padding-right: 5px;
            padding-bottom: 2px;
            padding-left: 5px;
    }
    
    .tablef {
            background: #CBD7DE ;
            padding-top: 10px;
            padding-right: 10px;
            padding-bottom: 10px;
            padding-left: 10px;
    }
    
    .catrow_noalb {
            background: #CBD7DE ;
            color : #000000;
            padding-top: 3px;
            padding-right: 10px;
            padding-bottom: 3px;
            padding-left: 10px;
    }
    
    .catrow {
            background: #F2F5F7 ;
            padding-top: 3px;
            padding-right: 10px;
            padding-bottom: 3px;
            padding-left: 10px;
    }
    
    .album_stat {
            font-size : 85%;
            margin: 5px 0px;
    }
    
    .thumb_filename {
            font-size: 80%;
            display: block;
    }
    
    .thumb_title {
            font-weight : bold;
            font-size: 80%;
            padding: 2px;
            display : block;
    }
    
    .thumb_caption {
            font-size: 80%;
            padding: 1px;
            display : block;
    }
    
    .thumb_caption a {
            text-decoration: underline;
            color: #000000;
    }
    
    
    .thumb_num_comments {
            font-weight: normal;
            font-size: 85%;
            padding: 2px;
            font-style : italic;
            display : block;
    }
    
    .user_thumb_infobox {
            margin-top: 1px;
            margin-bottom: 1px;
    }
    
    .user_thumb_infobox th {
            font-weight : bold;
            font-size: 100%;
            margin-top: 1px;
            margin-bottom: 1px;
            text-align : center;
    }
    
    .user_thumb_infobox td {
            font-size: 85%;
            margin-top: 1px;
            margin-bottom: 1px;
            text-align : center;
    }
    
    .user_thumb_infobox a {
            text-decoration: none;
            color: #000000;
    }
    
    .user_thumb_infobox a:hover {
            color: #000000;
            text-decoration: underline;
    }
    
    .sortorder_cell {
            background : #8AA5B5 ;
            color: #FFFFFF;
            padding-top: 0px;
            padding-bottom: 0px;
            padding-left: 0px;
            padding-right: 20px;
            margin: 0px;
    }
    
    .sortorder_options {
            font-family: Verdana, Arial, Helvetica, sans-serif;
            background : #8AA5B5 ;
            color: #FFFFFF;
            padding: 0px;
            margin: 0px;
            font-weight: normal;
            font-size: 80%;
            white-space: nowrap;
    }
    
    .navmenu {
            font-family: "Trebuchet MS", Verdana, Geneva, Arial, sans-serif;
            color: #FFFFFF;
            font-weight: bold;
            background : #8AA5B5 ;
            border-style: none;
    }
    
    .navmenu img {
            margin-top: 1px;
            margin-right: 5px;
            margin-bottom: 1px;
            margin-left: 5px;
    }
    
    .navmenu a {
            display: block;
            padding-top: 2px;
            padding-right: 5px;
            padding-bottom: 2px;
            padding-left: 5px;
            text-decoration: none;
            color: #FFFFFF;
    }
    
    .navmenu a:hover {
            background : #F2F5F7 ;
            text-decoration: none;
            color:         #000000;
    }
    
    .admin_menu_thumb {
            font-family: Arial, Helvetica, sans-serif;
            font-size: 90%;
            border: 1px solid #CCD7E0;
            background-image : url(images/button_bg.gif);
            background-position : bottom;
            color: #000000;
            font-weight: bold;
            margin-top: 0px;
            margin-bottom: 0px;
            width: 85px;
    }
    
    .admin_menu_thumb a {
            color: #000000;
            text-decoration: none;
            display: block;
            position: relative;
            padding-top: 1px;
            padding-bottom: 1px;
            padding-left: 10px;
            padding-right: 10px;
    }
    
    
    .admin_menu_thumb a:hover {
            color: #000000;
            text-decoration: underline;
    }
    
    .admin_menu {
            font-family: Arial, Helvetica, sans-serif;
            font-size: 90%;
            border: 1px solid #CCD7E0;
            background-image : url(images/button_bg.gif);
            background-position : bottom;
            background-repeat: repeat-x;
            background-color: #FFFFFF;
            color: #000000;
            margin-top: 0px;
            margin-bottom: 0px;
            text-align: center;
    }
    
    .admin_menu a {
            color: #000000;
            text-decoration: none;
            display: block;
            position: relative;
            padding-top: 1px;
            padding-bottom: 1px;
            padding-left: 2px;
            padding-right: 2px;
    }
    
    .admin_menu a:hover {
            color: #000000;
            text-decoration: underline;
    }
    
    td #admin_menu_anim {
            background-image : url(images/button_bg_anim.gif);
    }
    
    .comment_date{
            color : #5F5F5F;
            font-size: 90%;
            vertical-align : middle;
    }
    
    .image {
            border-style: solid;
            border-width:1px;
            border-color: #000000;
            margin: 2px;
    }
    
    .imageborder {
            border: 1px solid #000000;
            background-color: #FFFFFF;
            margin-top: 30px;
            margin-bottom: 30px;
    }
    
    .display_media {
            background: #F2F5F7 ;
            padding-top: 3px;
            padding-right: 10px;
            padding-bottom: 3px;
            padding-left: 10px;
    }
    
    .thumbnails {
            background: #F2F5F7 ;
            padding: 5px;
    }
    
    .footer {
            font-size : 9px;
    }
    
    .footer a {
            text-decoration: none;
            color: #000000;
    }
    
    .footer a:hover {
            color: #000000;
            text-decoration: underline;
    }
    
    .statlink {
            color: #FFFFFF;
    }
    
    .statlink a {
            text-decoration: none;
            color: #FFFFFF;
    }
    
    .statlink a:hover {
            color: #FFFFFF;
            text-decoration: underline;
    }
    
    .alblink a {
            text-decoration: underline;
            color: #000000;
    }
    
    .alblink a:hover {
            color: #000000;
            text-decoration: underline;
    }
    
    .catlink {
            display: block;
            margin-bottom: 2px;
    }
    
    .catlink a {
            text-decoration: underline;
            color: #000000;
    }
    
    .catlink a:hover {
            color: #000000;
            text-decoration: underline;
    }
    
    .topmenu {
            font-family: "Trebuchet MS", Verdana, Geneva, Arial, sans-serif;
            line-height : 130%;
            font-size : 110%;
    }
    
    .topmenu a {
            color : #0033CC;
            text-decoration : none;
    }
    
    .topmenu a:hover  {
            color : #0033CC;
            text-decoration : underline;
    }
    
    .img_caption_table {
            border: none;
            background-color: #FFFFFF;
            width : 100%;
            margin : 0px;
    }
    
    .img_caption_table th {
            background: #D1D7DC ;
            font-size : 100%;
            color : #000000;
            padding-top: 4px;
            padding-right: 10px;
            padding-bottom: 4px;
            padding-left: 10px;
            border-top : 1px solid #FFFFFF;
    }
    
    .img_caption_table td {
            background: #F2F5F7 ;
            padding-top: 6px;
            padding-right: 10px;
            padding-bottom: 6px;
            padding-left: 10px;
            border-top : 1px solid #FFFFFF;
            white-space: normal;
    }
    
    .debug_text {
            border: #BDBEBD;
            background-color: #EFEFEF;
            width : 100%;
            margin : 0px;
    }
    
    .clickable_option {
            cursor : default;
    
    }
    
    .listbox_lang {
            color: #000666;
            background-color: #F2F5F7;
            border: 1px solid #F2F5F7;
            font-size: 80%;
            font-family: Arial, Helvetica, sans-serif;
            vertical-align : middle;
    }
    
    #vanity a {
            display:block;
            width:57px;
            height:20px;
            margin: 3px 20px;
    }
    #vanity img {border:0}
    #v_php {float:left;background-image:url(../../images/powered-php.gif);}
    #v_php:hover {background-image:url(../../images/h_powered-php.gif);}
    #v_mysql {float:left;background-image:url(../../images/powered-mysql.gif);}
    #v_mysql:hover  {background-image:url(../../images/h_powered-mysql.gif);}
    #v_xhtml {float:right;background-image:url(../../images/valid-xhtml10.gif);}
    #v_xhtml:hover {background-image:url(../../images/h_valid-xhtml10.gif);}
    #v_css {float:right;background-image:url(../../images/valid-css.gif);}
    #v_css:hover{background-image:url(../../images/h_valid-css.gif);}
    and this is the theme.php

    Code:
    define('THEME_IS_XHTML10_TRANSITIONAL',1); // Remove this if you edit this template until
                                               // you have validated it. See docs/theme.htm.
    
    
    // HTML template for main menu
    $template_sys_menu = <<<EOT
                    
    <div class="wireframemenu">
    
    <h1 style="text-align:center"><p>Navigation<hr /></p></h1>
    
    <!-- BEGIN home -->
                           <p><a href="{HOME_TGT}" title="{HOME_TITLE}">» {HOME_LNK}</a></p>
    <!-- END home -->
    
    <!-- BEGIN my_gallery -->
                           <p><a href="{MY_GAL_TGT}" title="{MY_GAL_TITLE}">» {MY_GAL_LNK}</a></p>
    <!-- END my_gallery -->
    
    <!-- BEGIN allow_memberlist -->
                            <p><a href="{MEMBERLIST_TGT}" title="{MEMBERLIST_TITLE}">» {MEMBERLIST_LNK}</a></p>
    <!-- END allow_memberlist -->
    
    <!-- BEGIN my_profile -->
                            <p><a href="{MY_PROF_TGT}">» {MY_PROF_LNK}</a></p>
    <!-- END my_profile -->
    
    <!-- BEGIN faq -->
                            <p><a href="{FAQ_TGT}" title="{FAQ_TITLE}">» {FAQ_LNK}</a></p>
    <!-- END faq -->
    
    <!-- BEGIN enter_admin_mode -->
                            <p><a href="{ADM_MODE_TGT}" title="{ADM_MODE_TITLE}">» {ADM_MODE_LNK}</a></p>
    <!-- END enter_admin_mode -->
    
    <!-- BEGIN leave_admin_mode -->
                           <p><a href="{USR_MODE_TGT}" title="{USR_MODE_TITLE}">» {USR_MODE_LNK}</a></p>
    <!-- END leave_admin_mode -->
    
    <!-- BEGIN upload_pic -->
                         <p><a href="{UPL_PIC_TGT}" title="{UPL_PIC_TITLE}">» {UPL_PIC_LNK}</a></p>
    <!-- END upload_pic -->
    
    <!-- BEGIN register -->
                           <p><a href="{REGISTER_TGT}" title="{REGISTER_TITLE}">» {REGISTER_LNK}</a></p>
    <!-- END register -->
    
    <!-- BEGIN login -->
                            <p><a href="{LOGIN_TGT}" title="">» {LOGIN_LNK}</a></p>
    <!-- END login -->
    
    <!-- BEGIN logout -->
                            <p><a href="{LOGOUT_TGT}" title="">» {LOGOUT_LNK}</a></p>
    <!-- END logout -->
    </div>
    EOT;
      
    // HTML template for sub_menu
    $template_sub_menu = <<<EOT
    
    <div class="wireframemenu">
    <!-- BEGIN custom_link -->
         <p><a href="{CUSTOM_LNK_TGT}" title="{CUSTOM_LNK_TITLE}">» {CUSTOM_LNK_LNK}</a></p>
    <!-- END custom_link -->
    
    <p><a href="location_map.php">» Посетени страни</a></p>
    
    <!-- BEGIN album_list -->
        <p><a href="{ALB_LIST_TGT}" title="{ALB_LIST_TITLE}">» {ALB_LIST_LNK}</a></p>
    <!-- END album_list -->
    <p><a href="{LASTUP_TGT}">» {LASTUP_LNK}</a></p>
    <p><a href="{LASTCOM_TGT}">» {LASTCOM_LNK}</a></p>
    <p><a href="{TOPN_TGT}">» {TOPN_LNK}</a></p>
    <p><a href="{TOPRATED_TGT}">» {TOPRATED_LNK}</a></p>
    <p><a href="{FAV_TGT}">» {FAV_LNK}</a></p>
    <p><a href="{SEARCH_TGT}">» {SEARCH_LNK}</a></p>
    </div>
    <hr />
    <div class="wireframemenu">
    <h1 style="text-align:center"><p>Friends<hr /></p></h1>
    <p><a href="http://www.avatar-bg.org">www.avatar-bg.org</a></p>
    <p><a href="http://www.party-bg.net/">www.party-bg.net</a></p>
    <p><a href="http://www.w3schools.com/"><img src="http://www.w3schools.com/images/w3schools88x31.gif" border="0" alt="" /></a></p>
    <p><a href="http://www.htmldog.com/"><img src="http://www.htmldog.com/badge3.gif" width="88" height="31" border="0" alt="HTML and CSS tutorials, references, and articles" /></a></p>
    </div>
    EOT;
    ?>
    i can pass the css validation without any errors, here is my css validation.

    Here is link to my site :
    http://www.abroadbg.com

    (Sorry for my bad english)

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,865
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    i can pass the css validation without any errors, here is my css validation.
    But there are soem errors in your markup, see http://validator.w3.org/check?uri=ht...Inline&group=0
    Fix them too.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •