相同的文字,样式,浏览器,但在不同的屏幕上不同的高度

时间:2015-08-27 15:19:29

标签: css

在不同的DPI屏幕上,一个标识网页似乎有不同的呈现方式。 字体相同(谷歌字体),没有媒体查询,但我有2.5行的差异。 this jsFiddle Big screen
客户说,他希望文本开始& 结束与其旁边的菜单位于同一高度。
如果有人想看到它13" notebook (1920x1080)
有什么建议吗?

JSFiddle:here is is

<section class="holder">
    <nav> <span class="selected">Popis</span>
 <span>Mapa</span>

    </nav>
    <div ng-if="selected.state=='popis'">
        <img src="http://dev.agereklama.cz/Images/Praha%209.png" class="filler" />
        <p>Do městského obvodu Prahy 9 a jeho části Prahy 14 patří také původně samostatná obec za tehdejší hranicí Velké Prahy jménem Kyje. Jméno obce Kyje (dříve Keje) je doloženo již k roku 1052 a je odvozeno od starého osobního jména Kyj , tj. "ves Kyjovy rodiny". V tomto období ves patřila pražskému arcibiskupství.</p>
        <p>Kyje se skládají ze sedmi místních čtvrtí, a to Staré Kyje, Jiráskova (původně Masarykova čtvrť), Aloisov, Lehovec, Nad rybníkem, Rajská Zahrada a Hutě.
            <br/>Kyje byly k Praze připojeny v roce 1968.</p>
        <p>V rezidenční čtvrti Hutě plné parků, zeleně a příjemných míst, jež je místně příslušná Praze 9 - Kyje, vzniká náš nový projekt <b>VILLA VICTORIA</b>.</p>
        <p>Nejbližší okolí projektu <b>VILLA VICTORIA</b> tvoří rodinné domy, zahrady, parky, dětská hřiště a základní občanská vybavenost. Veškeré vymoženosti velkoměsta, jako obchodní centrum, služby, městská doprava, metro jsou v docházkové vzdálenosti či jen pár minut vozem nebo autobusem ze zastávky poblíž domu.</p>
        <p>Potřebujete-li, snadno se napojíte na Vysočanskou radiálu, Pražský okruh, dálnici D11 a nebo rychlostní silnice R10. Místními komunikacemi se dostanete rychle na Černý Most, do Hloubětína nebo do Satalic. Čtvrtí projíždějí autobusy pražské MHD (linka 186 a 202). Na jih od Villa Victoria je situována stanice metra Rajská zahrada vzdálená jen 15 minut chůze. Do budoucna je plánována výstavba železniční zastávky v blízkosti Rajské zahrady a současně vznikne i pěší lávka, která zlepší propojení mezi čtvrtí Hutě a sídlištěm Černý Most.</p>
    </div>
</section>


*, *:after, *:before {
    box-sizing: border-box;
}

body {
    margin: 0;
    padding: 0;
    color: #333;
    font-family:'Roboto Condensed', sans-serif;
}

section nav {
    margin-top: 0;
    width: 100%;
}

img.filler {
    float: right;
    height: 190px;
    margin: 0 0 1em 1em;
}

p {
    text-align: justify;
}

.holder {
    width: 621px;
    margin: 0 auto;
}



section nav>span.selected {
    font-weight: bold;
}

section nav>span {
    display: inline-block;
    margin-right: 1em;
    cursor: pointer;
}

0 个答案:

没有答案