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">&nbsp;</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
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
Stačilo promazat pár <div> a už to jde.

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

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

0