Forum PHP Romania - Discutii despre PHP, MySQL, Javascript, AJAX, etc

MasterPhoton · Data înscrierii: 06/Mar/2003 Mesaje: 437

Salut,
Am 3 divuri, corespunzatoare a 3 sectiuni (coloane). Fiecare div este pozitionat float: left, position: fixed. Primul are left, top: 0 iar urmatoarele au margin-left = dimensiuniea celor de dinainte.
Problema: site-ul este facut sa se vada bine in 1024x768. Daca trec pe 800x600, cele trei coloane devin trei randuri (Adica se pozitioneaza unul sub altul). Cum fac sa nu se intample asta?

carco · Trimis: Vin Feb 17, 2006 1:36 pm Titlul subiectului:

pui width="suma celor 3 div-uri" pe div-ul ce le contine pe toate.

MasterPhoton · Data înscrierii: 06/Mar/2003 Mesaje: 437

Oh. Eu NU facusem un container pentru toate divurile :) Mi s-a parut ca nu am nevoie :).

MasterPhoton · Data înscrierii: 06/Mar/2003 Mesaje: 437

Intr-adevar, s-a rezolvat. Multumesc.
Insa acum este alta problema:
in Firefox nu se vede scrollbarul vertical, desi este evident ca textul si continutul paginii sunt mai "adanci" decat dimensiunea paginii. Toate divurile au specificate height destul de mare (900px).
So?

carco · Trimis: Sâm Feb 18, 2006 7:54 am Titlul subiectului:

era bun un link... incearca body,html {height:100%}

MasterPhoton · Data înscrierii: 06/Mar/2003 Mesaje: 437

Nu pot sa dau link, pentru ca nu e nimic public inca. Dau codul (stilurile):
Cod: HTML PAGES:
<body>
<div id="big_container">
<div id="left_side">Menu<br />
   <div id="menu"> <a href="#">Home Page</a><br /><br />
      <a href="servicii.html">Servicii</a><br /><br />
      <a href="despre_noi.html">Despre Noi</a><br /><br />
      <a href="contact.html">Contact</a><br />
   </div>
</div>

<div id="right_side">
   <h1>Bine ati venit</h1><br />
Aici pun textul...
</div>
<div id="right_side_pics"></div>
</div>
</body>

SI stilurile
Cod:
body, html
{
background-color: #F8F79B;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
margin-top: 0px;
margin-left: 0px;
margin-bottom: 0px;
margin-right: 0px;
padding: 0px;
height: 100%;
}
#big_container
{
position: fixed;
left: 0px;
top: 0px;
margin: 0px;
padding: 0px;
width: 1000px;
height: 900px;
}
#left_side
{
float: left;
background-color: #FFF;
border-right: #757575 1px solid;
width: 166px;
height: 900px;
position: fixed;
top: 0px;
left: 0px;
padding-left: 2px;
padding-top: 10px;
padding-right: 0px;
padding-bottom: 0px;
margin-right: 0px;
z-index: 1;
text-align: right;
}
#menu
{
margin-top: 150px;
margin-right: 10px;
font-size: 14px;
font-weight: bold;
}
#menu a:link, #menu a:visited
{
text-decoration: none;
clear-top: 10px;
color: #000;
margin-bottom: 10px;
padding-bottom: 10px;
}
#menu a:hover
{
text-decoration: none;
border-right: #fff 2px solid;
color: #6D1605;
}
#right_side
{
float: left;
background-color: #F8F79B;
background: url('images/bkg_dreapta.jpg') repeat-y;
position: fixed;
left: 167px;
top: 0px;
width: 600px;
height: 900px;
padding-left: 10px;
padding-top: 10px;
padding-right: 10px;
padding-bottom: 10px;
margin: 0px;
z-index:0;
}

carco · Trimis: Sâm Feb 18, 2006 10:15 am Titlul subiectului:

incearca sa scoti
position: fixed;
left: 0px;
top: 0px;
de pe big_container (poti lasa doar un position:relative) si, de asemenea, acum ca am vazut codul, as renunta si la height:100% de pe body si html.

P.S. html nu are nevoie de toate proprietatile alea puse la body, daca vroiai doar sa setezi height, il puteai pune separat.

carco · Trimis: Sâm Feb 18, 2006 11:02 am Titlul subiectului:

Eu acum am vazut, e putin cam imbarligat ce ai tu acolo, ai si float si position:fixed... Pe de alta parte, tu pui fixed la toate elementele, e normal sa nu mai apara scroll (ca nu mai are ce sa scrolleze)...
Nu stiu de ce vrei musai sa pui un width fixed...
Ia incearca asta, vezi daca e cam ce vrei:
Cod:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Layout 3 columnd, left,right fixed</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type="text/css">
html,body {height:100%;}
body {
margin:0 176px 0 176px;
font-family: Verdana,Arial,sans-serif;
font-size:10pt;
background:pink;
}
#left {
position:fixed;left:0;top:0;
width:166px;height:100%;
padding:5px;
overflow:auto;
background:red;
}
#right {
position:fixed;right:0;top:0;
width:166px;height:100%;
padding:5px;
overflow:auto;
background:blue;
}
#content {
padding:5px;
}
</style>
</head>
<body>
<div id="left">
<div id="menu">
<h4>Menu</h4>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Servicii</a></li>
<li><a href="#">Despre noi</a></li>
</ul>
</div>
<div id="altechestii">
<p>Ma quande lingues coalesce, li grammatica del r...</p>
</div>
</div>

<div id="content">
<h1>Bine ati venit</h1>
<p>Ma quande lingues coalesce, li grammatica del resultant lingue es plu simplic e regulari quam ti del coalescent lingues. Li nov lingua franca va esser plu simplic e regulari quam li existent Europan lingues. ...</p>
</div>

<div id="right">
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat... </p>
</div>
</div>
</body>
</body>
</html>

MasterPhoton · Data înscrierii: 06/Mar/2003 Mesaje: 437

Da, multumesc.
Cam asa e... la ce foloseste overflow ?

kleampa · Trimis: Sâm Feb 18, 2006 11:40 am Titlul subiectului:

iti face sroll intr-un div, in loc sa foloseti frame

MasterPhoton · Data înscrierii: 06/Mar/2003 Mesaje: 437

Multumesc, asta era urmatoarea intrebare :)

PHPRomania Bot · Mie Dec 26, 2007 7:01 pm