Pozicování na vršek a spodek DIVu s prostřední částí – CSS – Fórum – Programujte.com
 x   TIP: Přetáhni ikonu na hlavní panel pro připnutí webu
Reklama
Reklama

Pozicování na vršek a spodek DIVu s prostřední částí – CSS – Fórum – Programujte.comPozicování na vršek a spodek DIVu s prostřední částí – CSS – Fórum – Programujte.com

 

Hledá se programátor! Plat 1 800 € + bonusy (firma Boxmol.com)
eXMarty
~ Anonymní uživatel
2 příspěvky
8. 12. 2014   #1
-
0
-

Ahoj všem,
předem chci říct, že jsem se svépomocí snažil najít ideální řešení hodně dlouhých hodin, ale neúspěšně.

Moje přání - mám DIV rámec, u kterého zadám rozměry, v tomto divu bych potřeboval mít část pozicovanou nahoru, pak několik (pro jednoduchost zde 2 části) které se budou rovnat postupně od spodního okraje DIVu a ve zbylém místě mezi "horní" a "spodní" částí bych pak měl část, která by byla vertikálně centrovaná.
Obsah jednotlivých částí může být různě douhý text (jeden či více řádků) proto tedy nemůžu použít zadané margin či podobně (nebo si to alespoň zatím myslím). V prostřední části by měl být obrázek (jestliby to bylo z hlediska řešení podstatné)

Pokus o naznačení pro conejvětší zjednodučení je zde:
 

.ramec {
    float: left;
    width: 250px;
    height: 300px;
    border: 1px solid silver;
    margin: 2px;
    text-align: center;
}
 
<div class="ramec">
    <div class="">toto bych rád nahoře centrovaně</div>
    <div class="">tahle část velká tak aby zaujímala zbytek volného místa a obsah aby byl centrovám horizontálně i vertikálně</div>
    <div class="">první blok umístěný dole centrovaně (spodní kraj u horního kraje následujícího DIVu)</div>
    <div class="">druhý blok umístěný dole centrovaně (spodní kraj u spodního kraje DIVu "ramec") </div>
</div>


Moc děkuji všem za navedení a váš čas

Nahlásit jako SPAM
IP: 62.24.93.–
Reklama
Reklama
peter
~ Anonymní uživatel
2528 příspěvků
8. 12. 2014   #2
-
0
-

- pouzij presne rozmery
- pouzij tabulku
- pouzij tabulkovy layout
Vsechno ostatni nez tabulka se ti rozsype, kdyz tam vlozis nespravny obsah treba s marginem. Tudiz nema smysl to pak resit pozicovanim, kdy mu casti a nebo floatovanim, kdy se ti to cele rozsype v ruznych prohlizecich a casto prave na marginu nebo paddingu.

Nicmene, na jakpsatweb neco podobneho se uz resilo. Vzdycky, kdyz tam nekdo navrhl nejake reseni, tak bylo plne forko prave dotazu, ze se jim to rozsypalo. Nicmene, ti moderatori furt to sve reseni obhajovali :) Nevim, jestli je reseni, ktere zpusobuje vic problemu nez resi, vhodne zrovna pro zacatecniky...
https://www.google.com/search?…

 

Nahlásit jako SPAM
IP: 2001:718:2601:1f7:4db9:13...–
peter
~ Anonymní uživatel
2528 příspěvků
8. 12. 2014   #3
-
0
-

* jo, tabulku, myslim html TABLE TR TD s css border=0 borderspacing=0 a tusim jeste necim pro dalsi prohlizece
* tabulkovy layout je css3 display:table, display:table-cell, display:table-row...

Nahlásit jako SPAM
IP: 2001:718:2601:1f7:4db9:13...–
Zjistit počet nových příspěvků

Přidej příspěvek

Toto téma je starší jak čtvrt roku – přidej svůj příspěvek jen tehdy, máš-li k tématu opravdu co říct!

Ano, opravdu chci reagovat → zobrazí formulář pro přidání příspěvku

×Vložení zdrojáku

×Vložení obrázku

Vložit URL obrázku Vybrat obrázek na disku
Vlož URL adresu obrázku:
Klikni a vyber obrázek z počítače:

×Vložení videa

Aktuálně jsou podporována videa ze serverů YouTube, Vimeo a Dailymotion.
×
 
Podporujeme Gravatara.
Zadej URL adresu Avatara (40 x 40 px) nebo emailovou adresu pro použití Gravatara.
Email nikam neukládáme, po získání Gravatara je zahozen.
-
Pravidla pro psaní příspěvků, používej diakritiku. ENTER pro nový odstavec, SHIFT + ENTER pro nový řádek.
Sledovat nové příspěvky (pouze pro přihlášené)
Sleduj vlákno a v případě přidání nového příspěvku o tom budeš vědět mezi prvními.
Reaguješ na příspěvek:

Uživatelé prohlížející si toto vlákno

Uživatelé on-line: 0 registrovaných, 11 hostů

Podobná vlákna

Pozicování — založil orw

Pozicování — založil Telka

Pozicování — založil Peterka35

Pozicování — založil Salieri

 

Hostujeme u Českého hostingu       ISSN 1801-1586       ⇡ Nahoru Webtea.cz logo © 20032016 Programujte.com
Zasadilo a pěstuje Webtea.cz, šéfredaktor Lukáš Churý