Autor Zpráva
TT1905
Profil
Zdravím, předně se omlouvám za nejspíš amatérský popis problému, vše se učím průběžně metodou pokus-omyl, a zatím se příliš neorientuji.

Problém je následující. Upravuji šablonu webových stránek http://www.maspodripsko.cz, a cílem bylo z původně dvousloupcové podoby udělat sloupce 3 a k tomu ještě jedno pole širší, viz obrázek:

To se podařilo vytvořit pomocí úpravy css: http://www.maspodripsko.cz/assets/templates/mas/css.css (prostredni layout)

V poli "vodorovný" se zobrazuje text článků, sloupec 1 zobrazuje seznam článků z jedné kategorie, sloupec 2 z druhé, a sloupec 3 je na reklamy, ankety a podobné blblinky.

Problém nastává ve chvíli, kdy se otevře článek. Ten je umístěný v poli "vodorovný", takže byl překrytý s1 a s2. To se mi podařilo vyřešit pomocí overflow, ale zůstává problém se sloupcem 3, který je vodorovným polem odsouván dolů. A právě to bych potřeboval vyřešit.

Takže má prosba je následující. Dokáže mi někdo poradit, jakým způsobem zařídit, aby:
1) Pole "vodorovny" a "s3" byla vedle sebe
2) (Vedlejší, není nutné) První strana zůstala rozdělena na 4 pole, a všechny ostatní stránky obsahovaly pouze pole "vodorovny" a "s3"

Předem všem moc děkuji
juriad
Profil
Musíš některé části obalit do jednoho elementu, viz ukázka.
http://kod.djpw.cz/rdeb
TT1905
Profil
Zkusím, díky moc :)
TT1905
Profil
Tak jsem to zkoušel, a nepomohlo to, ten vodorovný pořád odsouvá ty zbylé tři dolů. Asi něco dělám špatně.

CSS:
#stranka { width:1200px; float: center; text-align: justify; margin: 0 auto; margin-top: 15px; border-top-left-radius: 6em 75px; border-top-right-radius: 6em 75px; background: url("pozadi-stred.png") top center no-repeat; min-height: 500px; }
#stranka #vodorovny { width: 72%; margin-top: 0px; margin-left: 8%; height: auto; overflow: none; float:left; }
#stranka #s1 { width: 42%;  overflow: hidden; float: left;}
#stranka #s2 { width: 42%;  overflow: hidden; float: left; }
#stranka #s3 { width: 16%; margin-top: auto; overflow: hidden; float: left; }

HTML:
<div id="stranka">
        
          <div id="vodorovny">
          
              <h1>[[*pagetitle]]</h1>

            [[*content]]
          
        </div>
          
              
            <div id="s1">
         
                <div id="o">
              
            [[*id:eq=`1`:then=`[[$novinkyMAS]]`]] 

                  </div>

           </div>
              
          
        <div id="s2">
          
            <div id="o">
            
            [[*id:eq=`1`:then=`[[$novinky]]`]] 

                 </div>
              
        </div>
        
        
      
                  <div id="s3">
              <a href="/strategie-rozvoje/"><img src="/IMG/2014eu.png" title="strategie" height="42" width="160" class="top-normal"></a> 
              <br>
              <div align="center"><a href="/strategie-rozvoje/"><font size="2" color="#000000"><b>Zapojte se do plánování budoucnosti - je to na Vás!!!</b></font></a></div>
              <br>
              <br>
                   <a  target="_blank" href="http://leader.isu.cz/iframe-mapa-regionu?kodsdru=709"><img width="160" height="108" style="float: center; margin: 0px" alt="Interaktivní mapa MAS" src="http://www.maspodripsko.cz/IMG/mapamas.jpg"></a>
                <br>
             <br>
              <div id="blok-bbsluzba-997435"></div>
            <a id="odkaz-bbsluzba-997435" href="http://miniaplikace.blueboard.cz">Miniaplikace</a>
            <script type="text/javascript" src="http://miniaplikace.blueboard.cz/widget-anketa-997435"></script>
              <br>
              <br>
              [[$FBBOX]]
              <br>
              
              
                </div>
      </div>      


Pokud by byl někdo ochotný mi to předělat, velice bych to ocenil :)
jenikkozak
Profil
Přesuň ve zdrojovém kódu blok s3 před s1.
TT1905
Profil
To když udělám, tak zase s3 odsouvá dolů s2 a s1 :(
jenikkozak
Profil
Máš pravdu, promiň. Prvku s3 ještě nastav float:right.
TT1905
Profil
Pecka, už je to jak má být. Moc děkuji :)

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: