[HTML][CSS]przycinanie diva Opcje

[-ccssik-]

Witam,

w jaki sposób zrobić tak aby zaznaczone na obrazku tło:

http://s2.ifotos.pl/img/ddddd_hxsprha.jpg

przycinalo się gdy nie miesci sie na ekranie?

Jak zrobilem sztywnego div to szerokosc wynosiła 1254px; więc przy rozdzielczości 1024px pokazuje się scroll... Jak tego uniknąć?

Coś w stylu overflow: hidden...

[5skakanek]

A jak umieszczasz to tło...?
Bo wystarczy normalnie w css background:url(obrazek.gif); i już nie ma problemu. Jak robisz tak długie elementy to nic dziwnego, że się scroll pokazuje. Jeśli chcesz mieć diva na szerokość strony, napisz w css div{width:100%}; i ew body{margin:0;} żeby uniknąć marginesów.
Tu masz o umieszczaniu tła: klik

[Magic WWW]

Jak kolega wyżej podał, spróbuj zrobić to poprzez użycie procentów zamiast konkretnych wielkości dodatkowo CSS danego diva powinien wyglądać mniej więćej tak:

Kod

div#element {width:100%;overflow:hidden}

Ten post edytował Magic WWW 9.04.2011, 08:42:50

[-cssik-]

Mam o to taki kod:

[HTML] pobierz, plaintext 
<div class="columns">
                <div class="splash">
 
                    <div id="splash_01"></div>
                    <div id="splash_02">
                        <div id="left"></div>
                        <div id="right">
                             <?php include_once('menu.php');?>
                        </div>
                    </div>
 
                </div>
        </div>
[HTML] pobierz, plaintext 

i CSS:

[HTML] pobierz, plaintext 
.columns{
    background: url(images/columns_background.gif) repeat-y;
    width:100%;
    overflow:hidden;
        margin: 0;
    padding:0;
}
 
.splash{
    overflow: hidden;
    width: 980px;
    margin: auto;
    padding: 15px 0 0 0;
    color: #007dc8;
    font-family: Franklin Gothic Medium;
    font-size: 13px;
    cursor: pointer;
 
}
 
 
.splash #splash_01{
    background: url(images/stream_03.gif) no-repeat;
    width: 980px;
    height: 211px;
    float: left;
}
 
.splash #splash_02 #left{
    background: url(images/stream_05.gif) no-repeat;
    width: 737px;
    height: 172px;
    float: left;
}
 
.splash #splash_02 #right_01{
    background: url(images/stream_06.gif) no-repeat;
    width: 103px;
    height: 27px;
    float: left;
    padding: 26px 0 0 140px;
}
 
.splash #splash_02 #right_01:hover{
    background: url(images/stream_06b.gif) no-repeat;
    width: 103px;
    height: 27px;
    float: left;
    padding: 26px 0 0 140px;
}
 
.splash #splash_02 #right_02{
    background: url(images/stream_07.gif) no-repeat;
    width: 133px;
    height: 24px;
    float: left;
    padding: 5px 0 0 110px;
}
 
.splash #splash_02 #right_02:hover{
    background: url(images/stream_07b.gif) no-repeat;
    width: 133px;
    height: 24px;
    float: left;
    padding: 5px 0 0 110px;
}
 
.splash #splash_02 #right_03{
    background: url(images/stream_08.gif) no-repeat;
    width: 153px;
    height: 25px;
    float: left;
    padding: 5px 0 0 90px;
}
 
.splash #splash_02 #right_03:hover{
    background: url(images/stream_08b.gif) no-repeat;
    width: 153px;
    height: 25px;
    float: left;
    padding: 5px 0 0 90px;
}
 
.splash #splash_02 #right_04{
    background: url(images/stream_09.gif) no-repeat;
    width: 173px;
    height: 25px;
    float: left;
    padding: 8px 0 0 70px;
}
 
.splash #splash_02 #right_04:hover{
    background: url(images/stream_09b.gif) no-repeat;
    width: 173px;
    height: 25px;
    float: left;
    padding: 8px 0 0 70px;
}
 
.splash #splash_02 #right_05{
    background: url(images/stream_10.gif) no-repeat;
    width: 183px;
    height: 22px;
    float: left;
    padding: 6px 0 0 60px;
}
 
 
.splash #splash_02 #right_05:hover{
    background: url(images/stream_10b.gif) no-repeat;
    width: 183px;
    height: 22px;
    float: left;
    padding: 6px 0 0 60px;
}
[HTML] pobierz, plaintext 

jak widać do waszych sugestii sie przychylilem, ale:

pod rozdzielczościa 1024px inaczej wyglada i pod 1280px inaczej:

http://s1.ifotos.pl/img/ScreenSho_hxsxqss.jpg

http://s2.ifotos.pl/img/ScreenSho_hxsxqqp.jpg