| Autor | Zpráva | ||
|---|---|---|---|
| maestorm Profil |
#1 · Zasláno: 18. 12. 2015, 09:54:49
Hezké ráno,
potřeboval bych poradit jak v tomto případě vytvořit responzivní dvousloupcový layout. Přikládám kód jak v HTML5 tak v CSS. {block #title}{$page->title} - {include parent}{/block}
{block #keywords}{$page->keywords}{if !strlen($page->keywords)}{include parent}{/if}{/block}
{block #description}{$page->description}{if !strlen($page->description)}{include parent}{/if}{/block}
{block content}
<div class="news_post_class">
<div class="post-info">
<h1 class="post-title">{$page->title}</h1>
<div n:foreach="$items as $row" class="clearfix">
<h2>
<a n:href="$row->link $row->id">{$row->title}</a>
</h2>
<div class="news_threesome_img">
<a n:href="$row->link $row->id">
<img n:src="$row->image, 200, 150, crop" alt="{$row->title}" title="{$row->title}">
</a>
</div>
<div class="news_threesome_p">
{$row->perex|noescape}
</div>
</div>
</div>
</div>
{control p}/* styles for single post */
.news_post_class {
margin: 0 auto;
margin-bottom: 3em;
width: 60%;
}
@media all and (max-width : 768px) {
.news_threesome_img { margin-right: 19.5em; float: left; width: 150px;}
.news_threesome_p { position: relative; width: 10em; float: left;}
}
@media all and (max-width : 330px) {
.news_threesome_img { margin-right: 19.5em; float: left;}
.news_threesome_p { position: relative; width: 18.75em; float: left;}
}Velice by mi to pomohlo. Děkuji. |
||
| Kcko Profil |
#2 · Zasláno: 18. 12. 2015, 14:23:16
maestorm:
Proč sem dáváš šablonu z Nette? Hod sem odkaž na živou ukázku ... |
||
|
Časová prodleva: 10 let
|
|||
0