• 13-02-2009, 11:48:18
    #1
    Üyeliği durduruldu
    merhaba 2 sorunum var...
    1 suan elimde css kodu var div in koselerini oval yapıyor guzel hosda ben onların sag tarafına golge vermek ıstıyorum nasıl yaparım...
    2. tekrar elımde bu anlatacagımın css kodu var ve o sayfanın sagına golge verıyor ben solunada vermeyı ıstıyorum ama kodlara baktım bulamadım bır yardımcı olursanız sevinirim...
    1. kodu

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <meta name="generator" content="HAPedit 3.1">
    <style type="text/css">
    body{ margin: px 0px 0px 5px;}
    .tasiyici{ text-align:center;}
    .ortalayici{ width:800px; margin-left:auto; margin-right:auto;}
    h1,h2,p{margin: 0 10px;}
    h1{font-size: 250%;color: #FFF}
    h2{font-size: 200%;color: #f0f0f0}
    p{padding-bottom:1em}
    h2{padding-top: 0.3em}
    div#haberler{ margin: 0 10%;background: #9900FF; width:800px; margin-left:0px;}
    b.rtop, b.rbottom{display:block;background: #FFF;}
    b.rtop b, b.rbottom b{display:block;height: 1px; overflow: hidden; background: #CCCCCC;}
    b.r1{margin: 0 5px}
    b.r2{margin: 0 3px}
    b.r3{margin: 0 2px}
    b.rtop b.r4, b.rbottom b.r4{margin: 0 0px;height: 10px;}
    </style>
    </head>
    <body>
    <div class="tasiyici">
    <div class="ortalayici">
    <div id="haberler">
    <b class="rtop"><b class="r1"></b><b class="r2"></b><b class="r3"></b><b class="r4"></b></b>
    yazi gelecek
    <b class="rbottom"><b class="r4"></b><b class="r3"></b><b class="r2"></b><b class="r1"></b></b>
    </div>
    </div>
    </div>
    </div>
    </div>
    </body>
    </html>






    2. kodu
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <head>
    <title>Ortaya Gölge Verme</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <link media="screen" type="text/css" rel="stylesheet" href="webtoolkit.shadow.css" />
    <style>
    body { margin: 0px; padding: 0px; font-family: verdana; font-size: 12px;}
    .tasiyici{ text-align:center;}
    #shadow-ortalayici { position: relative; left: 3px; top: 3px; margin-right: 3px; margin-bottom: 3px; width:800px; margin-left:auto; margin-right:auto;}
    #shadow-ortalayici .shadow2,
    #shadow-ortalayici .shadow3,
    #shadow-ortalayici .ortalayici { position: relative; left: -1px; top: -1px;}
    #shadow-ortalayici .shadow1 { background: #F1F0F1;}
    #shadow-ortalayici .shadow2 { background: #DBDADB;}
    #shadow-ortalayici .shadow3 { background: #B8B6B8;}
    #shadow-ortalayici .ortalayici { background: #ffffff; border: 1px solid #848284; padding: 10px;}
    </style>
    </head>
    <body>
    <div class="tasiyici">
    <div id="shadow-ortalayici">
    <div class="shadow1">
    <div class="shadow2">
    <div class="shadow3">
    <div class="ortalayici">
    ORTA
    </div>
    </div>
    </div>
    </div>
    </div>
    </div>
    </body>
    </html>
  • 13-02-2009, 16:38:02
    #2
    1. marign ve padding ayarlarınla oynarak yapabilirsin.
    misal sol ve üst için verme, sağ ve alt için gölge yapsın.
    veya iki div için sol ve üst boyutlar aynı olsun, sağ ve alt boyutunu artır.

    (mantık şu: iki tane üst üste div koycan, alttakinin background rengi misal gri olacak, üstteki farketmez. alttakinin boyutu veya margini farklı olunca bi kaç pixel kayıp gölge gibi duracak.)