مشکل در قرار گرفت دایو در جای خود

[me64]

سلام
اگه درست نظر شما را متوجه شده باشم منم دقیقا همان فرمایش شما را انجام دادم. به تصویر زیر توجه فرمایید



در وسط دو کادر قرمز میبینید. کادر قرمز رنگ بالایی یک دایو کلی به اسم level2 است. در داخل این level2 دو دایو دیگه به اسم "bayanat" و "emamha" قرار دارد
همچنین که در عکس میبینید در سمت راست کادر یک دایو کلی سبز رنگ با نام "level4" قرار دارد که شامل سه دایو زرد رنگ با نامهای "last-news" و "top-news" و "prayer-times" است
حالتی که مد نظر است تا اینها در کنار هم قرار بگیرند هم در عکس واضح است


کدهای مربوط به template.css

کد: (انتخاب همه)

/*@charset "utf-8"; */
/* CSS Document */

/*
# ------------------------------------------------------------------------
# Joomla Free Templates
# ------------------------------------------------------------------------
# Copyright (C) 2012-2020 (..). All Rights Reserved.
# Website:  (..)
# ِDesign by : (..)
# ------------------------------------------------------------------------
*/
@font-face {
    
    font-family: 'pars';
    src: url('../font/IranNastaliq.eot');
    src: url('../font/IranNastaliq.eot?#iefix') format('embedded-opentype'),
         url('../font/IranNastaliq.woff') format('woff'),
         url('../font/IranNastaliq.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

body{
    color:#006;
    font-family:Tahoma, Geneva, sans-serif;
    font-size:14px;
    direction:rtl;
}

#main{
    width:75%;
    height:auto;
    margin:0 auto;
    background-repeat:repeat;
    border-radius:5px;    
}

#header {
    height:200px;
    width:100%;
    background-image: url(../images/baghiyatallah.jpg);
    background-repeat: no-repeat;
    background-position: right top;
    border-radius:5px;
}

#search {
    float:left;
    height:25px;
    width:250px;
    padding-top:180px;
    color:#333;
}

/*::::: menu :::::*/

#menu {
    direction:rtl;
    font-family:"IranNastaliq";
    font-size:54px;
}

#hot-news{
    width:100%;
    height:20px;
    background-color:#E9E6E6;
}

#level1 {
    width:100%;
    height:450px;
    float:right;
    margin:0 auto 5px auto;
    display: block;
}

#slider {
    height:340px;
    width:60%;
    float:right;
    border-radius:5px;
    background-color:#999;
    margin-right:10px;
    margin-top:5px;
}

#notice{
    color:#FF9
    height:340px;
    width:37%;
    background-color:#ECF1F5;
    border-radius:5px;
    float:right;
    padding-top:0px;
    margin-top:5px;
    margin-right:5px;
    margin-left:5px;
    margin-bottom:5px;
    background-repeat: no-repeat;
    background-position: right top;
    
    
    background: -moz-linear-gradient(top, #FF9 0%, #3C0 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FF9), color-stop(100%,#3C0));
    background: -webkit-linear-gradient(top, #FF9 0%,#3C0 100%);
    background: -o-linear-gradient(top, #FF9 0%,#3C0 100%);
    background: -ms-linear-gradient(top, #FF9 0%,#013953 100%);
    background: linear-gradient(top, #FF9 0%,#3C0 100%);
}


#notice h3 {
    color: #fff;
    background: -moz-linear-gradient(top, #E230B7 0%, ##E230B7 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#E230B7), color-stop(100%,#E230B7));
    background: -webkit-linear-gradient(top, #E230B7 0%,#E230B7 100%);
    background: -o-linear-gradient(top, #E230B7 0%,#E230B7 100%);
    background: -ms-linear-gradient(top, #E230B7 0%,#E230B7 100%);
    background: linear-gradient(top, #E230B7 0%,#E230B7 100%);
    height: 20px;
    /* line-height: 44px; */
    padding-right: 24px;
    border-bottom-style:double;
    border-bottom-color:#000;
    font-size:12px;
    margin-top: 0;
}

#other-website {
    height: auto;
    width: auto;
    border-radius: 5px;
    background-color:#ECF1F5;
    float: left;
    margin-top:30px;
}

#other-website ul li {
    list-style: none outside none;
}

#level4 {
    float:right;
}

#last-news {
    height: auto;
    width: 200px;
    border-radius: 5px;
    background-color:#ECF1F5;
    font-size:12px;
    direction:rtl;
    line-height:20px;
    margin-left: 10px;
}

#last-news ul li {
    list-style: none outside none;
}

#last-news ul li:before {
    list-style: none outside none;
    content: "\0BB \020";
    font-size:16px;
    color:#E230B7;
}

#last-news h3 {
    color: #fff;
    background: -moz-linear-gradient(top, #E230B7 0%, ##E230B7 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#E230B7), color-stop(100%,#E230B7));
    background: -webkit-linear-gradient(top, #E230B7 0%,#E230B7 100%);
    background: -o-linear-gradient(top, #E230B7 0%,#E230B7 100%);
    background: -ms-linear-gradient(top, #E230B7 0%,#E230B7 100%);
    background: linear-gradient(top, #E230B7 0%,#E230B7 100%);
    height: 20px;
    /* line-height: 44px; */
    padding-right: 24px;
    border-bottom-style:double;
    border-bottom-color:#000;
    font-size:12px;
    margin-top: 0;
}

#top-news{
    height: auto;
    width: 200px;
    border-radius: 5px;
    background-color:#ECF1F5;
    font-size:12px;
    direction:rtl;
    line-height:20px;
    margin-top:10px;
    margin-left: 10px;
    left:10px;
    clear:both;
}

#top-news ul li{
    list-style: none outside none;
}

#top-news ul li:before {
    list-style: none outside none;
    content: "\0BB \020";
    font-size:16px;
    color:#E230B7;
}

#top-news h3 {
    color: #fff;
    background: -moz-linear-gradient(top, #E230B7 0%, ##E230B7 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#E230B7), color-stop(100%,#E230B7));
    background: -webkit-linear-gradient(top, #E230B7 0%,#E230B7 100%);
    background: -o-linear-gradient(top, #E230B7 0%,#E230B7 100%);
    background: -ms-linear-gradient(top, #E230B7 0%,#E230B7 100%);
    background: linear-gradient(top, #E230B7 0%,#E230B7 100%);
    height: 20px;
    /* line-height: 44px; */
    padding-right: 24px;
    border-bottom-style:double;
    border-bottom-color:#000;
    font-size:12px;
    margin-top: 0;
}

#prayer-times{
    height: auto;
    width: 200px;
    border-radius: 5px;
    background-color:#ECF1F5;
    direction:rtl;
    margin-top:10px;
    margin-left: 10px;
    left:10px;
}

#content {
    width: auto;;
    height: auto;
    margin:0 auto;
    margin-top: 30px;
    border-radius: 5px;
    margin-right: 5px;
    margin-left:5px;
    overflow: hidden;
}


#level2 {
    width:100%;
    float:left;
    height:300px;
    margin:0 10 5px auto;
}

#emamha{
    height:200px;
    width:22%;
    float:right;
    border-radius:5px;
    background-color:#ECF1F5;
    margin-right:10px;
    margin-top:0px;
    direction:rtl;
    line-height:20px;
    
}

#emamha h3 {
    color: #fff;
    background: -moz-linear-gradient(top, #FF9 0%, #3C0 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FF9), color-stop(100%,#3C0));
    background: -webkit-linear-gradient(top, #FF9 0%,#3C0 100%);
    background: -o-linear-gradient(top, #FF9 0%,#3C0 100%);
    background: -ms-linear-gradient(top, #FF9 0%,#013953 100%);
    background: linear-gradient(top, #FF9 0%,#3C0 100%);
    height: 20px;
    /* line-height: 44px; */
    padding-right: 24px;
    border-bottom-style:double;
    border-bottom-color:#000;
    font-size:16px;
    margin-top: 0;
}

#bayanat{
    height:200px;
    width:22%;
    float:right;
    border-radius:5px;
    background-color:#ECF1F5;
    margin-right:10px;
    margin-top:5px;


}

/* #bayanat .globalnews {
    height: 259px;
}
*/

#bayanat h3 {
    color: #fff;
    background: -moz-linear-gradient(top, #FF9 0%, #3C0 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FF9), color-stop(100%,#3C0));
    background: -webkit-linear-gradient(top, #FF9 0%,#3C0 100%);
    background: -o-linear-gradient(top, #FF9 0%,#3C0 100%);
    background: -ms-linear-gradient(top, #FF9 0%,#013953 100%);
    background: linear-gradient(top, #FF9 0%,#3C0 100%);
    height: 20px;
    /* line-height: 44px; */
    padding-right: 24px;
    border-bottom-style:double;
    border-bottom-color:#000;
    font-size:16px;
    margin-top: 0;
}

#news{
    height:200px;
    width:22%;
    float:right;
    border-radius:5px;
    background-color:#ECF1F5;
    margin-right:10px;
    margin-top:5px;
    overflow:hidden;
    clear:both;
}

#news h3 {
    color: #fff;
    background: -moz-linear-gradient(top, #FF9 0%, #3C0 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FF9), color-stop(100%,#3C0));
    background: -webkit-linear-gradient(top, #FF9 0%,#3C0 100%);
    background: -o-linear-gradient(top, #FF9 0%,#3C0 100%);
    background: -ms-linear-gradient(top, #FF9 0%,#013953 100%);
    background: linear-gradient(top, #FF9 0%,#3C0 100%);
    height: 20px;
    /* line-height: 44px; */
    padding-right: 24px;
    border-bottom-style:double;
    border-bottom-color:#000;
    font-size:16px;
    margin-top: 0;
}

#level3 {
    width:100%;
    height:300px;
    margin:0 10 5px auto;
    display: block;
}

#picture{
    height:300px;
    width:32%;
    float:right;
    border-radius:5px;
    background-color:#999;
    margin-right:10px;
    margin-top:15px;
}

#voice{
    height:300px;
    width:32%;
    float:right;
    border-radius:5px;
    background-color:#999;
    margin-right:10px;
    margin-top:15px;
}

#film{
    height:300px;
    width:32%;
    float:right;
    border-radius:5px;
    background-color:#999;
    margin-right:10px;
    margin-top:15px;
}

#mashahir{
    height:auto;
    width:980px;
    border-radius:5px;
    background-color:#CCC;    
    clear:both;
    margin-top:15px;
    margin-right:10px;
}

#footer {
    font-family:IranNastaliq;
    font-size:14px;
    height:auto;
    width:980px;
    border-radius:5px;
    background-color:#ECF1F5;    
    clear:both;
    text-align:center;
    margin-right:10px;
    margin-top:15px;
    overflow:hidden;
}

a {
    text-decoration: none;
}

a:visited {
    color:#0000EE;
}

کد مربوط به فایل index.php

کد: (انتخاب همه)

<?php
defined('_JEXEC') or die('Restricted access');
JHtml::_('behavior.framework', true);
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" >
<head>
<jdoc:include type="head" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/system/css/system.css" type="text/css" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/system/css/general.css" type="text/css" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/css/template.css" type="text/css" />
</head>

<body>
    <div id="main">  
         
        <div id="header">
            <?php if($this->countModules('search')): ?>
            <div id="search">
                <jdoc:include type="modules" name="search" style="xhtml" />          
            </div><!--End search-->
            <?php endif; ?>
        </div><!--End heder-->
        
        <?php if($this->countmodules('menu')): ?>
        <div id="menu">
            <jdoc:include type="modules" name="menu" style="xhtml" />
        </div><!--End menu-->
        <?php endif; ?>
        
        <?php if($this->countmodules('hot-news')): ?>
        <div id="hot-news">
            <jdoc:include type="modules" name="hot-news" style="xhtml" />
        </div><!--hot-news-->
        <?php endif; ?>
        
        <?php if($this->countModules('slider + notice')): ?>          
        <div id="level1">        
            <?php if($this->countmodules('slider')): ?>
            <div id="slider">
                <jdoc:include type="modules" name="slider" style="xhtml" />
            </div><!--End slider-->
            <?php endif; ?>
            
            <?php if($this->countmodules('notice')): ?>
            <div id="notice">
                <jdoc:include type="modules" name="notice" style="xhtml" />
            </div><!--End notice-->
            <?php endif; ?>        
        </div><!--End level1-->
        <?php endif; ?>
      
         <?php if($this->countmodules('other-website')): ?>
                    <div id="other-website">
                        <jdoc:include type="modules" name="other-website" style="xhtml" />
                    </div><!--other-website-->
                <?php endif; ?>  
        
        
         <?php if($this->countModules('emamha + bayanat')): ?>          
        <div id="level2">
        
            <?php if($this->countmodules('emamha')): ?>
            <div id="emamha">
                <jdoc:include type="modules" name="emamha" style="xhtml" />
            </div><!--End emamha-->
            <?php endif; ?>
            
            <?php if($this->countmodules('bayanat')): ?>
            <div id="bayanat">
                <jdoc:include type="modules" name="bayanat" style="xhtml" />
            </div><!--End bayanat-->
            <?php endif; ?>                      
        </div><!--level2-->
        <?php endif; ?>
              
          
                              
        <?php if($this->countModules('last-news + top-news + prayer-times')): ?>
            <div id="level4">
               <?php if($this->countmodules('last-news')): ?>
                    <div id="last-news">
                        <jdoc:include type="modules" name="last-news" style="xhtml" />
                    </div><!--last-news-->
                <?php endif; ?>
                    
                <?php if($this->countmodules('top-news')): ?>
                    <div id="top-news">
                        <jdoc:include type="modules" name="top-news" style="xhtml" />
                    </div><!--top-news-->
                <?php endif; ?>
                
                <?php if($this->countmodules('prayer-times')): ?>
                    <div id="top-news">
                        <jdoc:include type="modules" name="prayer-times" style="xhtml" />
                    </div><!--prayer-times-->
                <?php endif; ?>                
                
            </div><!--level4-->  
        <?php endif; ?>

                 
        
                    
        <div id="content">
            <jdoc:include type="message" />
               <jdoc:include type="component" />
            <jdoc:include type="modules" name="content" style="xhtml" />
        </div><!--End content-->            
        
    
              
        <?php if($this->countModules('news + picture + voice + film')): ?>          
            <div id="level3">
            
            <?php if($this->countmodules('news')): ?>
            <div id="news">
                <jdoc:include type="modules" name="news" style="xhtml" />
            </div><!--End news-->
            <?php endif; ?>
            
                <?php if($this->countmodules('picture')): ?>
                <div id="picture">
                    <jdoc:include type="modules" name="picture" style="xhtml" />
                </div><!--End picture-->
                <?php endif; ?>
                
                <?php if($this->countmodules('voice')): ?>
                <div id="voice">
                    <jdoc:include type="modules" name="voice" style="xhtml" />
                </div><!--End voice-->
                <?php endif; ?>
                
                <?php if($this->countmodules('film')): ?>
                <div id="film">
                    <jdoc:include type="modules" name="film" style="xhtml" />
                </div><!--End film-->
                <?php endif; ?>
            </div><!--level3-->
        <?php endif; ?>
    
        
        <?php if($this->countmodules('mashahir')): ?>
        <div id="mashahir">
            <jdoc:include type="modules" name="mashahir" style="xhtml" />
        </div><!--End mashahir-->
        <?php endif; ?>
        
        <?php if($this->countmodules('footer')): ?>
        <div id="footer">
            <jdoc:include type="modules" name="footer" style="xhtml" />
        </div><!--End footer-->
        <?php endif; ?>

    </div><!--End main-->
</body>
</html>

دموی آنلاین
دیدن لینک ها برای شما امکان پذیر نیست. لطفا ثبت نام کنید یا وارد حساب خود شوید تا بتوانید لینک ها را ببینید.