Dva divy vedle sebe, z toho jeden vycentrován

9. 8. 2013 10:31:14

Ahoj,

Dělám stránku, kde mám jeden hlavní div, šířku nastavenou na 980px a pomocí margin: 0 auto; ho mám vycentrován. V tomto divu je obsah stránky. Teď chci ale napravo od něj dát div, ve kterém bude jen obrázek (součást designu stránek). Nedaří se mi to udělat tak, aby hlavní div zůstal stále vycentrován. Nevím jak jinak to totiž řešit než pomocí float.

Díky za případné rady.

9. 8. 2013 10:31:14

https://webtrh.cz/diskuse/dva-divy-vedle-sebe-z-toho-jeden-vycentrovan#reply931953

intehos

(35 hodnocení)

9. 8. 2013 10:36:00

DIV 980px a vedle něj dáš druhý div s obrázkem a oba je obalíš do divu, který bude mít součet obou šířek a bude mít hodnotu margin:0 auto;

9. 8. 2013 10:36:00

https://webtrh.cz/diskuse/dva-divy-vedle-sebe-z-toho-jeden-vycentrovan#reply931952

Kloban

9. 8. 2013 10:38:53

Napsal intehos;983740
DIV 980px a vedle něj dáš druhý div s obrázkem a oba je obalíš do divu, který bude mít součet obou šířek a bude mít hodnotu margin:0 auto;

Já ale chci aby byla stránka vycentrována podle toho hlavního divu. A ten s obrázkem byl od něj napravo. V případě, že by se nevešel na obrazovku, tak by zmizel.

9. 8. 2013 10:38:53

https://webtrh.cz/diskuse/dva-divy-vedle-sebe-z-toho-jeden-vycentrovan#reply931951

intehos

(35 hodnocení)

9. 8. 2013 10:43:47

Tak potom budeš muset udělat div s position:absolute a vystrčit ho mimo hlavní div

9. 8. 2013 10:43:47

https://webtrh.cz/diskuse/dva-divy-vedle-sebe-z-toho-jeden-vycentrovan#reply931950

Petr Kobelka

9. 8. 2013 13:12:48

pokud znáš šířku toho DIVu s obrázkem, pak je to celkem jednoduché = podobné řešení jsem aplikoval. ty 2 DIVy obalíš ještě do jednoho, který bude mít šířku toho centrovaného + 2*šířka divu s obrázkem, tento div dáš margin: 0 auto. vnitřní div se bude také centrovat a ten div s obrázkem dáš position:absolute right:0 např. - přesný k-od jsem nepsal, ale myslím si, že myšlenka je vyjádřena celá

9. 8. 2013 13:12:48

https://webtrh.cz/diskuse/dva-divy-vedle-sebe-z-toho-jeden-vycentrovan#reply931949

Kloban

9. 8. 2013 13:24:35

Díky. Nášel jsem ještě toto řešení:

#sky-scraper-block {

left: 50%;

margin-left: 390px;

padding-top: 140px;

position: absolute;

text-align: center;

width: 160px;

}

Kde margin-left: 390px; je šířka toho hlavního divu děleno dvěma.

9. 8. 2013 13:24:35

https://webtrh.cz/diskuse/dva-divy-vedle-sebe-z-toho-jeden-vycentrovan#reply931948

intehos

(35 hodnocení)

9. 8. 2013 14:27:52

#div-prvni {

width: 980px; height:auto; margin:0 auto;

}

#div-druhy-dej-ho-hned-pod-

{

width: 160px; height:600px; position:absolute; margin-left:980px;

}

9. 8. 2013 14:27:52

https://webtrh.cz/diskuse/dva-divy-vedle-sebe-z-toho-jeden-vycentrovan#reply931947

Petr Kobelka

12. 8. 2013 10:10:54

Napsal intehos;983830
#div-prvni {
width: 980px; height:auto; margin:0 auto;
}
#div-druhy-dej-ho-hned-pod-
{
width: 160px; height:600px; position:absolute; margin-left:980px;
}

nechtěl jsi spíše napsat dovnitř toho prvního?, protože jinak by to absolutní odsazení nedávalo smysl.

12. 8. 2013 10:10:54

https://webtrh.cz/diskuse/dva-divy-vedle-sebe-z-toho-jeden-vycentrovan#reply931946

Pro odpověď se přihlašte.

Přihlásit