Autor Zpráva
jm81
Profil *
Ahoj,
obracím se s prosbou jak vyřešit problém otevírání odkazu z rámu tak aby se neotevřel v rámu, ale přitom v tom daném okně, čili aby se neotevřelo nové okno. Jde to nějak vyřešit?
Popř. jak jinak za pomoci HTML vyřešit 3 sloupcový web, kdy levý a pravý sloupec bude tvořit obrázek a střední sloupec menu, text atd. viz nástřel webu.
Předem díky každému za radu, podnět či nápad.

PS: pro mě asi ideální stav bez rámu, jen html bez css
_es
Profil
jm81:
Viď Odkazy » Target. No aj Problémy rámů.
Trejpa
Profil
jm81:
otevírání odkazu z rámu tak aby se neotevřel v rámu, ale přitom v tom daném okně
<a href="odkaz.html" target="_top">odkaz do stejného okna ven ze všech rámů</a>


Rámy jsou pro takovou stránku přežitkem. Trochy CSS neboj a do všech stránek nakopíruj společné části a měň jen obsah: příklad.
jm81
Profil *
Trejpa: Super, díky. Zkusím se prokousat tím CSS. Co jsem na to zatím koukal, tak jestli jsem to pochopil správně tak ta ukázka co jsi mi poslal, ale nemá tři sloupce ne? Já bych to potřeboval vykoumat tak, abych ty boční obrázky mohl na jednotlivých stránkách měnit.
Trejpa
Profil
jm81:
abych ty boční obrázky mohl na jednotlivých stránkách měnit
To záleží na tom, zda ty obrázky po stranách mají zůstat jen dekorací jako obrázek v pozadí, nebo tam chceš dávat něco významového, co já vím, nějaký odkaz, text, menu nebo podobně.
jm81
Profil *
Trejpa: pouze obrázky max jako odkaz.
Našel jsem na webu nějaký trojsloupcový layout a jsem zatím v této fázy:
<style type="text/css">
/* <![CDATA[ */
html {height: 100%; font-size: 62.5%;}

body {
    height: 100%;
    text-align: center;
    font: 1.2em Verdana, Arial, Helvetica, sans-serif;
    min-width: 980px;
    margin: 0; padding: 0;
    background-image: url("img/background.jpg")}
}

.cleaner {
    clear: both;
    height: 0;
    font-size: 0;
    visibility: hidden;
    }


#hlavicka {
    padding: 10px;
    border-bottom: 1px solid green;
    background: #F0FBDF;
    }

h1 {margin: 0; padding: 0;}
p {line-height: 1.8; margin-bottom: 16px;}


/* =============== Trisloupcovy layout =============== */
#obal {
    width: 980px;
    margin: 50px auto 0 auto;
    text-align: left;
    border: 1px solid green;
    }

#sloupec-levy {
    float: left;
    width: 220px;
    }

#sloupec-prostredni-pravy {
    float: right;
    width: 758px;
    }

#sloupec-prostredni-pravy #sloupec-l {
    float: left; 
    width: 536px; 
    }

#sloupec-prostredni-pravy #sloupec-p {
    float: right; 
    width: 220px; 
    }

.obsah {margin: 1em;}
/* =============== Trisloupcovy layout konec =============== */


#paticka {
    padding: 10px;
    border-top: 1px solid green;
    background: #F0FBDF;
    }

/* ]]> */
</style>

</head>

<body>



    <div id="sloupec-prostredni-pravy">
        <div id="sloupec-l">
            <div class="obsah">
<img alt="" src="img/logo.png" align="center" width="400" height="202" alt="logo" border="0" >
                
<table>
<tr>
       <td><font face="arial" color="grey" size="small"> <b>menu</b></td>
       <td><font face="arial" color="grey" size="small"> <b>káva</b></td>
</tr>

<tr>
       <td><a href="menu.html" title=""><img src="img/menu.jpg" border="0" onmouseover="this.src = 'img/menu_cb.jpg';" onmouseout="this.src = 'img/menu.jpg';"></a></td>
       <td><a href="http://www.sksrsni.cz/rozhledna/kava.html" title=""><img src="img/kava_cb.jpg" border="0" onmouseover="this.src = 'img/kava.jpg';" onmouseout="this.src = 'img/kava_cb.jpg';"></a></td>
</tr>

<tr>
       <td><font face="arial" color="grey" size="small"> <b>rezervace</b></td>
       <td><font face="arial" color="grey" size="small"> <b>výhled</b></td>
</tr>
<tr>
       <td><a href="rezervace.html" title=""><img src="img/rezervace_cb.jpg" border="0" onmouseover="this.src = 'img/rezervace.jpg';" onmouseout="this.src = 'img/rezervace_cb.jpg';"></a></td>
       <td><a href="vyhled.html" title=""><img src="img/vyhled_cb.jpg" border="0" onmouseover="this.src = 'img/vyhled.jpg';" onmouseout="this.src = 'img/vyhled_cb.jpg';"></a></td>
</tr>

<tr>
       <td><font face="arial" color="grey" size="small"> <b>akce</b></td>
       <td><font face="arial" color="grey" size="small"> <b>speciality</b></td>
</tr>
<tr>
       <td><a href="akce.html" title=""><img src="img/akce_cb.jpg" border="0" onmouseover="this.src = 'img/akce.jpg';" onmouseout="this.src = 'img/akce_cb.jpg';"></a></td>
       <td><a href="speciality.html" title=""><img src="img/speciality_cb.jpg" border="0" onmouseover="this.src = 'img/speciality.jpg';" onmouseout="this.src = 'img/speciality_cb.jpg';"></a></td>
</tr>
</table>

<br>
<br>

<table width="410">

<tr>
       <td><p style="text-align: justify"> <font face="arial" color="grey" size="2"> Text o nás o naši nabídce o rozhledně a akcích. Text o nás o naši nabídce o rozhledně a akcích. Text o nás o naši nabídce o rozhledně a akcích. Text o nás o naši nabídce o rozhledně a akcích. 
Text o nás o naši nabídce o rozhledně a akcích. Text o nás o naši nabídce o rozhledně a akcích. Text o nás o naši nabídce o rozhledně a akcích. Text o nás o naši nabídce o rozhledně a akcích. 
Text o nás o naši nabídce o rozhledně a akcích. Text o nás o naši nabídce o rozhledně a akcích. Text o nás o naši nabídce o rozhledně a akcích. Text o nás o naši nabídce o rozhledně a akcích. 
</p></font></td>
</tr>
</table>
</center>

            </div>
        </div> <!-- Konec prostredniho sloupce -->

        <div id="sloupec-p">
            <div class="obsah">
                <img alt="" src="img/pravy_line.jpg." align="center" width="324" height="800" alt="logo" border="0" >
            </div>
        </div> 
        <!-- Konec praveho sloupce -->
    <div class="cleaner">&nbsp;</div>
    </div> <!-- Konec sloupce obalujiciho prostredni a pravy sloupec -->

    <div id="sloupec-levy">
        <div class="obsah">
            <img alt="" src="img/levy_line.jpg." align="center" width="178" height="800" alt="logo" border="0" >
        </div>
    </div> <!-- Konec leveho sloupce -->

    <div class="cleaner">&nbsp;</div>


</div> <!-- Konec obaloveho divu -->
</body>
jm81
Profil *
Za živého boha nemůžu přijít na to jak CSS nadefinovat tři sloupce u sebe, kdy levý bude široký 172px, prostřední 550px a pravý 324px. Výška u všech 800px. Vše by to mělo být centrované na střed stránky. Se zbytkem bych si už poradil.
jm81
Profil *
Tak jsem dospěl k tomuto:
body {
    font-family: Verdana, Arial, Helvetica, sans-serif;
     background-image: url(img/background.jpg);
    font-size: 13px;
    color:grey
}

p {
    padding: 10px;
}

#wrapper {
    margin: 0 auto;
    width: 1200px;
}

#content {
    float: left;
    background: transparent;
    width: 520px;
}

#leftcolumn {
    background: transparent;
    width: 178px;
    float: left;
}

#rightcolumn {
    background: transparent;
    width: 324px;
    float: left;
}
Což už je 90% mé představy, ale pořád jsem nevyřešil problém se zarovnáním celého obsahu na střed stránky. Dá se to nějak v CSS vůbec vyřešit?
jm81
Profil
Vyřešeno. Tedy snad správně. Pokud jsem to správně pochopil tak to bylo způsobeno špatnou hodnotou wrapper, která místo 1200 měla být výsledek součtu sloupců čili 1046.
Ale, že jsem si pěkně pokecal :-)))))

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

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