| Autor | Zpráva | ||
|---|---|---|---|
| chleeba Profil |
Dobrý den chtěl bych na webu aplikovat ukázku Odkaz
Mám však problém když chci vložit do hlavičky pevné divy ( .box_left + .box_reight) tak se automaticky nezvětší i vnější div .hlavicka o velikost vnitřních divů .box_left + .box_reight. Chtěl bych aby hlavička reagovala na velikost vnitřních divů .box_left + .box_reight. Momentálně viz. ukázka divy .box_left + .box_reight přetékají. PS: Také bych chtěl div .box_reight vycentovat v hlavičce vertikálně Děkuji za radu, snad sem to napsal srozumitelně. Ukázka: Odkaz |
||
| Keeehi Profil |
#2 · Zasláno: 19. 1. 2016, 16:56:53
|
||
| chleeba Profil |
Keeehi:
Děkuji mockrát za radu :) Nebyla by prosím ještě ukázka na vertikální vycentrovani pravého divu. box_reight? |
||
| Keeehi Profil |
#4 · Zasláno: 19. 1. 2016, 19:11:11
Vertikální centrování v CSS - jak je ale v článku uvedeno, jde o už mírně zastaralý příspěvek. Vertical Centering in CSS je aktuální verze, je však v angličtině.
|
||
| chleeba Profil |
Děkuji za rady které sem použil na webu konkrétně clear a pomohlo to.
Mám hotovou hrubou stavbu webu odsavani-filtrace.cz ale mám problém a to že se mi linka na webu nezobrazí přes celou stránku při zmenšení webu /* ------------------------------ START_linka_100% ---------------------------------*/
.linka {
width: 100%;
height: 1px;
background: #e1e1e1;
margin: 30px 0px 30px 0px;
}
/* ------------------------------ KONEC_linka_100% ---------------------------------*/
|
||
| jakre Profil |
chleeba:
Rozmysli si, jak široký má být obsah. Jednou je 970 pixelů, podruhé 1050 pixelů a jindy tam máš navíc další padding nebo margin. Pro šířku používej nejlépe jednu třídu, například .obsah a nastav ji v CSS pevnou šířku:
.obsah {width: 960px; margin: 0 auto;}Současným třídám, jako je .hlavicka_obsah a další, nech nastavený marging a padding. |
||
| chleeba Profil |
jakre:
Děkuji z odpověď ale když stránky obalím .obsah {width: 960px; margin: 0 auto;} tak nedocílím toho že to bude po pruzích přes celou šířku a o to mi jde. Nebo je i jiné řešení. |
||
| jakre Profil |
chleeba:
Dobře. Vidím, že je to pro tebe asi moc složité. Ono to aplikování řešení, které jsem narvhoval, je trochu zdlouhavé, protože tvůj web není zcela vhodně nakódován. Zapomeň na něj a všem současným prvkům .název_obsah nastav šířku 960 pixelů (místo těch 970 a 1050 pixelů) a prvku .hlavicka_obsah odstraň ten padding. |
||
| chleeba Profil |
#9 · Zasláno: 20. 1. 2016, 16:22:13
jakre:
Jj je trochu v tom plavu :D zkusím předělat. Děkuji |
||
| chleeba Profil |
Měl bych prosím ještě dotaz jak dostat do šíře 960px tři stejně široké sloupce, ale aby vyplnili celý prostor 960px a byla mezi nimi mezera (první obrázek musí začínat na levéstraně bez okrajů a koncový obrázek musí končit na pravé straně bez okrajů) tak jako u obrázku výše (kolečka).
PS: Dá se to i vyřešit jinak než že si vytvořím koncový <div> .reseni_box_konec viz. ukázka Živá ukázka Moc děkuji za odpověď |
||
| Tomáš123 Profil |
#11 · Zasláno: 22. 1. 2016, 08:25:29
chleeba:
Iste: .reseni_obsah div + div {margin-left: 30px}V praxi to znamená, že sa deklarácia prejaví na každom prvku <div> v prvku s triedou reseni_obsah, ktorý má pred sebou iný <div>. Pokojne môžeš namiesto div použiť názov triedy ak potrebuješ konkrétnejší selektor.
|
||
| chleeba Profil |
Tomáš123:
Šlo byto prosím dát do ukázky Živá ukázka. Zatím sem to vyřešil takto nejde mi udělat tvůj postup odsavani-filtrace.cz |
||
| Tomáš123 Profil |
#13 · Zasláno: 24. 1. 2016, 15:12:55
chleeba:
Živá ukázka |
||
| chleeba Profil |
Tomáš123:
Děkuji použil jsem a funguje skvěle, ale nechápu zápis: .reseni_obsah .reseni_box + .reseni_box { .... Proč se tam dvakrát musí objevit .reseni_box a proč je tam to znaménko + Děkuji za vysvětlení :) PS: Ale nefungu je to u referenci (chtěl bych stejně udělat) tam to funguje jen u prvněch tří obrázků a pak zbytek je rozházený viz. Živá ukázka |
||
| Tomáš123 Profil |
#15 · Zasláno: 26. 1. 2016, 17:04:36
chleeba:
„Proč se tam dvakrát musí objevit .reseni_box a proč je tam to znaménko +“ Snažil som sa vyriešiť situáciu jediným selektorom bez nutnosti použiť ďalšiu triedu v HTML. Pre bližšie informácie o selektore viď: Seznam všech CSS 3 selektorů. Riešení tvojho problému je viac: • Živá ukázka - CSS3 selektor s pseudotriedou: nth-child , ktorý vynuluje margin každej tretej položke
• preskladať štruktúru HTML, aby šlo použiť jednoduchší selektor, čo môžeme ďalej riešiť opäť viacerými spôsobmi: – Živá ukázka - CSS3 selektor priameho súrodenca – Živá ukázka - CSS3 selektor s pseudotriedou : first-child s lepšou podporou
– nejaký zásah do HTML pridaním dodatočnej triedy (nie vytvorením úplne novej ako v tvojej ukážke vyššie [#10]) • nejaký zásah do pôvodného HTML pridaním triedy, čím sa nebude dať tak pohodlne prestaviť zobrazenie pri prípadnej potrebe zmeniť počet stĺpcov • mnoho ďalších kombinácií Riešení je dosť, ide o to, vybrať niečo s čo najlepším pomerom kompatibility a pohodlia zmeny. Najpohodlnejšie je prvé, ale podpora by mohla byť aj lepšia. Ja by som použil jednu z podmožností druhej položky. |
||
|
Časová prodleva: 8 let
|
|||
0