Autor | Zpráva | ||
---|---|---|---|
Fastman Profil |
Zdravím,
Dělám kamarádovi stránky do školy, ale narazil jsem na problém. Zde přikládám obrázky, aby to bylo hned na první pohled jasné o čem mluvím. Stránky při rozlišení 1920x1080 vypadají takhle: http://fastmancz.sweb.cz/www/merac2.jpg Při zmenšení prohlížeče či rozlišení vypadají stránky takhle: http://fastmancz.sweb.cz/www/problem.jpg Potřebuji, aby to všechno bylo na stejném místě při jakémkoliv rozlišení, aby to nemělo vliv na rozlišení či zmenšení okna prohlížeče. Předem se omlouvám za šílený kód. Index.html <title>Název stránky</title> <link rel="stylesheet" href="./style.css" type="text/css"/> <center><div id="menu_logo"><h1>Inteligentný merač spotreby</h1><a href="index.php"></a> <div id="fixedContainer"> <div style="position: fixed; center: 80px; right: 680px; no-repeat;0 auto;display: block;" <div id="menu_ramecek"> <div id="header"> </div> <div id="menu-box"> <ul id="menu" class="clearfix"> <li class="first"><a class="active" href="/">Úvod</a></li> <li><a href="#">Prehlad spotreby</a></li> <li><a href="#">Nastavenia</a></li> </ul> </div> </center> <!--Zacatek textu---> <div id="text"> <h1>Úvod</h1> <br> Stránka o.... </div> style.css /* Text */ body, html { background-color: #191919; color: #FFFFFF; font-family: Arial,Tahoma,Verdana; font-size: 12px; margin: 0px; padding: 0px; } /* Menu_text */ #menu_logo {width: 900px; height: 144px; background: url(./images/menu_banner.png);} /* Menu */ #menu_ramecek {width: 550px; height: 144px;} #menu-box {background: #1C4E71 url('img/menu-bg.gif') repeat-x 0 0;} #menu {width: 460px; margin: 0 auto;} #menu li { float: left; display: inline; list-style-type: none; text-align: center; } #menu li a { text-decoration: none; color: #FFF; float: left; display: inline; line-height: 35px; padding: 0 18px; border-right: 1px solid #6E9DBE; } #menu li.first a {border-left: 1px solid #6E9DBE;} #menu li a:hover, #menu li a.active {background-color: #133F5D;} /* Clearfix */ .clearfix:after { display: block; clear: both; visibility: hidden; height: 0; font-size: 0; content: ' '; } .clearfix {min-height: 1px;} .clearfix {display: inline-block;} /* Pro IE/Mac */ /* Backslash hack - nemel by to videt IE/Mac \*/ .clearfix {display: block;} /* Konec hacku */ /* ]]> */ #fixedContainer { position: fixed; } /* TEXT */ #text { position: absolute; left: 540px; top: 1px font-family: Verdana; position: fixed; } Děkuji všem za případné rady. |
||
user243 Profil |
#2 · Zasláno: 27. 1. 2014, 18:44:38
Hoj,
bez urážky, ale lépe se mi pracuje s živou ukázkou; mimo to nevidím v tvém kódu žádný doctype , html , head a body ;
nemáš tam žádný obalovací div s pevnou šířkou pro celý obsah webu a tak se ani není moc co divit, že Ti tam věci "skáčou", když je pozicuješ zleva/zprava.
|
||
Fastman Profil |
#3 · Zasláno: 27. 1. 2014, 19:07:23
Stačilo promazat pár <div> a už to jde.
|
||
Časová prodleva: 11 let
|
0