هر چقدر متنم زیاد شد کادر سبز رنگ به طور اتومات بیاد پایین

Amir001

Member
من میخوام همانطور که تو عکسم پیوست کردم.
در قسمت آبی متن قرار بدم.طوری که هر چقدر متنم زیاد شد کادر سبز رنگ به طور اتومات بیاد پایین.
ممنون میشم راهنماییم کنید:rose:
 

پیوست ها

  • help.jpg
    help.jpg
    141.5 کیلوبایت · بازدیدها: 13

Amir001

Member
خدمت شما اینا کد css قالبم:
PHP:
body {
    background-image:url('../images/gradi.jpg');
    background-attachment: scroll;
    background-position:center;
    background-repeat:repeat-y;
    background-size:100%;
}
a:link {
    
    color: gray;
    text-decoration:none;
}
a:hover {
    color:black;
}
a:visited {
    color:gray;
}
#TopColor {
    background-image: url('../images/TopBody.png');
    background-repeat: repeat-x;
    background-attachment: fixed;
    background-position: left top;
    position: absolute;
    top: 0px;
    width:100%;
    height: 30px;
    left:0px;
}
#web {
    width: 900px;
    margin-right: auto;
    margin-left: auto;
    margin-top: 73px;
}
#heder {
    background-image: url('../images/Heder2.png');
    background-repeat: no-repeat;
    width: 800px;
    height: 110px;
    margin-right: auto;
    margin-left: auto;
    margin-top:6px;
}
#menu {
    background-color:black;
    width: 800px;
    height: 24px;
    margin-right: auto;
    margin-left: auto;
    margin-top:110px;
}
#menu :link {
    color:gray;
    text-decoration: none;
}
#menu :hover {
    color:white;
}
#slide {
    background-image: url('../images/PicSlide.png');
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: center top;
    width: 800px;
    height: 340px;
    margin-right: auto;
    margin-left: auto;
    margin-top:-14px;
}
#user1 {
    background-image: url('../imagesj/PicMadule.png');
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: center top;
    width: 241px;
    height: 187px;
    float: left;

}
#user {
    width: 800px;
    height: auto;
    overflow: hidden;
    margin-right: auto;
    margin-left: auto;
    margin-top:25px;
}
#user2 {
    background-image: url('../imagesj/user3.png');
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: center top;
    width: 241px;
    height: 187px;
    float: left;
    margin-left:37px;
}
#user3 {
    background-image: url('../imagesj/PicMadule.png');
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: center top;
    width: 241px;
    height: 187px;
    float: left;
    margin-left: 37px;
}
#gradient {
    background-image: url('../images/Gradient.png');
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: center top;
    width: 800px;
    height: 500px;
    margin-right: auto;
    margin-left: auto;
    margin-top:10px;
}
#right {
    width: 200px;
    height: auto;
    float: right;
    overflow: hidden;
    margin-top: 30px;
}
#right1 {
    width: 220px;
    height: 240px;
    float: right;
}
#titr {
    width: 100px;
    height: 25px;
    float: right;
    margin-top: 10px;
    margin-right: 10px;
    text-align: left;
}
#icon1 {
    width: 21px;
    height: 31px;
    float: right;
    background-image: url('../images/icon.png');
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: left center;
}
#ic1 {
    background-image: url('images/ic.png');
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: right top;
    clip: rect(auto, auto, auto, auto);
    width: 4px;
    height: 4px;
}
#tit {
    height: 250px;
    width: 200px;
    float: right;
}
#titr1 {
    text-align: right;
    margin-right:30px;
}
#titr2 {
    text-align: right;
    margin-right:30px;
}
#titr3 {
    text-align: right;
    margin-right:30px;
}
#titr4 {
    text-align: right;
    margin-right:30px;
}
#titr5 {
    text-align: right;
    margin-right:30px;
}
#titr6 {
    text-align: right;
    margin-right:30px;
}
#titr7 {
    text-align: right;
    margin-right:30px;
}
#ic1 {
    background-image: url('../images/ic.png');
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: right center;
    width: 8px;
    height: 8px;
    float: right;
    margin-top:9px
}
#ic2 {
    background-image: url('../images/ic.png');
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: right center;
    width: 8px;
    height: 8px;
    float: right;
    margin-top:9px
}
#ic3 {
    background-image: url('../images/ic.png');
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: right center;
    width: 8px;
    height: 8px;
    float: right;
    margin-top:9px
}
#ic4 {
    background-image: url('../images/ic.png');
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: right center;
    width: 8px;
    height: 8px;
    float: right;
    margin-top:9px
}
#ic5 {
    background-image: url('../images/ic.png');
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: right center;
    width: 8px;
    height: 8px;
    float: right;
    margin-top:9px
}
#ic6 {
    background-image: url('../images/ic.png');
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: right center;
    width: 8px;
    height: 8px;
    float: right;
    margin-top:9px
}
#ic7 {
    background-image: url('../images/ic.png');
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: right center;
    width: 8px;
    height: 8px;
    float: right;
    margin-top:9px
}
#comment {
    width: 360px;
    height: 20px;
    float: right;
    margin-right: auto;
    margin-top: 45px;
    direction: rtl;
    margin-left: auto;
}
#left {
    width: 150px;
    height: 350px;
    float: right;
    margin-top: 35px;
    margin-left: 20px;
}
#right2 {
    width: 152px;
    height: 200ox;
    float: right;
    overflow: hidden;
}
#tright2 {
    width: 240px;
    height: 53px;
    float: right;
    text-align: right;
    margin-top:108px;
}
#left1 {
    width: 272px;
    height: 209px;
    float: right;
    text-align: right;
    margin-top: 20px;
}
#icd9 {
    width: 21px;
    height: 20px;
    background-image: url('../images/icon.png');
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: right center;
    float: right;
    margin-top:3px;
}

#tleft {
    text-align: right;
    width:197px;
    margin-top:-30px;
}
#left2 {
    width:272px;
    height: 209px;
    float: right;
    text-align: right;
    margin-top: 20px;
    margin-right:75px;
}

#ColorRed {
    background-color: #FF0000;
    background-repeat: repeat-x;
    background-attachment: scroll;
    background-position: left center;
    width:100%;
    height: 4px;
    position:absolute;
    left:0px;
    margin-top:308px;
}
#ColorBlack {
    background-color: #000000;
    background-repeat: repeat-x;
    background-attachment: scroll;
    background-position: left center;
    width:100%;
    height: 300px;
    left:0px;
    margin-top:312px;
    position:absolute;
}
#bottom1 {
    height: auto;
    float: right;
    direction:rtl;
    margin-right:30px;
}
#tb {
    color: #FF0000;
    font-family: tahoma;
    height: 20px;
    float: right;
}
#bottom2 {
    height: auto;
    float: right;
    margin-right:500px;
    direction:rtl;
}
#bottom2:link {
    color:white;
    text-decoration:none;
}

#tb2 {
    color: #FF0000;
    font-family: tahoma;
    height: 20px;
    float: right;
}
#bottom3 {
    height: auto;
    float: left;
    direction:rtl;
    margin-left:30px;
}
#tb3 {
    color: #FF0000;
    font-family: tahoma;
    height: 20px;
    float: left;
}
#complet {
    width:100%;
    margin-left:auto;
    margin-right:auto;
}
#complet :link {
    color:white;
}
#google {
    float:right;
    position:fixed;
    color:red;
}
#search {
width:215px;
float:left;
text-align:right;
margin-left:-2px;
margin-top:-1px;
direction:rtl;
}
 

Amir001

Member
اینا هم کد php&html&... :
PHP:
<?php  
 // no direct access 
 defined( '_JEXEC' ) or die( 'Restricted access' );
 
 ?>
<!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" /> 
<title>Untitled 1</title>
<link rel="stylesheet" type="text/css" href="<?php echo $this->baseurl ;?>/templates/<?php echo $this->template ;?>/css/template.css" />
<style type="text/css">
.style2 {
    text-align: right;
}
.style5 {
    color: #999999;
    font-size: small;
    font-family: Tahoma;
}
.style6 {
    font-family: Tahoma;
}
.style7 {
    color: #999999;
    font-size: small;
}
.style10 {
    color: #999999;
    font-size: 13pt;
    font-family: Tahoma;
}
.style11 {
    color: #999999;
    font-size: 13pt;
}
</style>
</head>

<body>
<div id="google"><jdoc:include type="modules" name="google" style="xhtml" /></div>
    <div id="TopColor">
        <div id="heder"></div>
    </div>
    <div id="web">
        <div id="menu" class="style2">
            <span class="style6"><span lang="fa" class="style11">
            <a href="index.php?option=com_content&view=frontpage">صفحه اصلی</a> 
            </span> 
            </span> 
            <span lang="en-us" class="style10">|</span><span lang="fa" class="style5"> 
            </span><span lang="fa" class="style10"> 
            <a href="#">درباره ما </a> 
            </span><span lang="en-us" class="style10">|</span><span lang="fa" class="style10"><a href="index.php?option=com_contact&view=contact&id=1">تماس با ما</a></span>
                <div id="search"><jdoc:include type="modules" name="search" style="xhtml" />
</div>
            </div>
        <div id="slide"><jdoc:include type="modules" name="slide" style="xhtml" />
</div>
        <div id="user">
            <div id="user1"><jdoc:include type="modules" name="user1" style="xhtml" />
</div>
            <div id="user2"><jdoc:include type="modules" name="user2" style="xhtml" />
</div>
            <div id="user3"><jdoc:include type="modules" name="user3" style="xhtml" />
</div>
        </div>
        <div id="gradient">
            <div id="right">
                <div id="right1">
                <map name="FPMap0" id="FPMap0">
                <area href="d" shape="rect" coords="97, 33, 169, 51">
                <area href="e" shape="rect" coords="116, 55, 165, 76">
                <area href="f" shape="rect" coords="127, 85, 167, 102">
                <area href="g" shape="rect" coords="116, 109, 168, 129">
                <area href="http://ent.ir/" shape="rect" coords="48, 138, 168, 156">
                <area href="i" shape="rect" coords="74, 161, 168, 182">
                <area href="j" shape="rect" coords="67, 187, 168, 211">
                </map>
                <img alt="" src="<?php echo $this->baseurl ;?>/templates/<?php echo $this->template ;?>/images/menuOrginal.png" width="200" height="240" usemap="#FPMap0"></div>
                <div id="tright2">
                    <img alt="" src="<?php echo $this->baseurl ;?>/templates/<?php echo $this->template ;?>/images/gra.png" width="175" height="100"></div>
            <div id="right2"><jdoc:include type="modules" name="right2" style="xhtml" />
            </div>
            </div>
            <div id="comment"><jdoc:include type="component" /></div>
                
            <div id="left">
                <div id="left1">
                    <div id="tleft"><img alt="" src="<?php echo $this->baseurl ;?>/templates/<?php echo $this->template ;?>/images/tleft.png" width="65" height="17"><jdoc:include type="modules" name="left1" style="xhtml" /></div></div>
                <div id="left2"><jdoc:include type="modules" name="left2" style="xhtml" />
</div>
            </div>

        </div>
        
    <div id="ColorRed"></div>
    <div id="ColorBlack">
    
    <div id="complet">
    <div id="tb"><span lang="fa"></span><div id="bottom1"><jdoc:include type="modules" name="bottom1" style="xhtml" /></div>
        

            
        </div>    
        

            <div id="tb2"><span lang="fa"></span><div id="bottom2"><jdoc:include type="modules" name="bottom2" style="xhtml" /></div>
        </div>    
        <div id="tb3"><span lang="fa"></span><div id="bottom3"><jdoc:include type="modules" name="bottom3" style="xhtml" /></div>

            
        </div>    
                </div></div>
        
    </div>    

</body>

</html>
 

pouya saadeghi

Active Member
مطمئنید این کد مال همین صفحه ایه که عکسشو گذاشتید؟
خروجی html رو اگه میشه لطف کنید. یا اگه آنلاینه آدرس سایت رو بدید
 

جدیدترین ارسال ها

بالا