css div problem

**alexdog1805** · 03-05-2010, 10:22 PM

I have this css style:

Code:

<style type="text/css">
<!--{}

body {padding:0;margin:0}

#banner img {width:100%;margin:auto;border-bottom:1px solid;border-color:black;}

#pozacentrusus {width:100%;margin:auto;}

#pozastanga {width:20%;margin-top:5%}

#pozadreapta {position:absolute;margin-left:80%;width:20%;height:40%;top:200px}

#pozacentrujos {margin-top:10%;width:100%;height:5%;border-bottom:1px solid;border-color:black;}

#cuvintecheie {color:grey;width:100%}


{}
-->
</style>

and this html file:

Code:

<html>
<head>
<title>..::OtisWeb::.. - Web Design | Web Hosting | Optimizare Web | Service I.T. | I.T. Shop</title>
<link rel="stylesheet" type="text/css" href="style2.css">
</head>
<body>


<div id="banner" align="center"><img src="images/banner.gif"></div>

<div id="pozacentrusus" align="center"><img src="images/shape46617375.gif" width="100%" height="5%"></div>

<div id="pozastanga"><img src="images/bigfinal.jpg" width="100%" height="50%"><br><br><img src="images/final.jpg" width="100%" 

height="30%"></div>

<div id="pozadreapta"><img src="images/bigfinal.jpg" width="100%" height="100%"></div>

<div id="pozacentrujos" align="center"><img src="images/shape46634046.gif" width="100%" height="100%"></div>

<div id="cuvintecheie"><center>html, php, forum, v-mark, his, pc, d-link, microsoft, sony,hp, creative, dell, web design, hosting, lg, 

samsung, inscrierea ava, ibm, printer, desktop, seo, mouse, ip-time, intel, gaming, horizon, laptop, notebook, director web, asus, philips, 

toshiba, acer, keyboard, kingston, genius, epson, lenovo, msi, xbox360, lite on, gigabyte, lexmark, anunturi, apc, belkin , packard bell, 

delux, amd, elixir, placa video, bitdefender, spire, asrock, galaxy, pqi, kingmax,  biostar, carcasa, hub hosting, dezvoltare it, 

consumabile, imprimanta, placa de baza, flybook, innovision, infimax, optimizare, optimizare google, web design timisoara, optimizare 

timisoara, hosting timisoara, calculatoare timisoara, calculatoare arad, web design arad, optimizare web arad, magazin de calculatoare arad, 

magazin de calculatoare timisoara, it arad, it timisoara</center><center>

</body>


</html>

the problem is why div "pozadreapta: isn't positioned to the right of div "poza stanga" and is positioned above of it. pls help

**stringcugu** · 03-05-2010, 11:23 PM

try this
<style type="text/css">

</style>

**stringcugu** · 03-05-2010, 11:25 PM

forgot to close the </div> in cuvintecheie

<div id="banner" align="center"><img src=" 5.gif"></div>
<div id="pozacentrusus" align="center"><img src=" 5.gif" width="100%" height="5%"></div>
<div id="pozastanga"><img src="1.gif" width="100%" height="50%"></A>
<img src="3.gif" width="100%" height="30%">
</div>
<div id="pozadreapta"><img src="usa.gif" width="100%" height="100%"></div>
<div id="pozacentrujos" align="center"><img src="6.gif" width="100%" height="100%"></div>
<div id="cuvintecheie"><center>html, php, forum, v-mark, his, pc, d-link, microsoft, sony,hp, creative, dell, web design, hosting, lg,
samsung, inscrierea ava, ibm, printer, desktop, seo, mouse, ip-time, intel, gaming, horizon, laptop, notebook, director web, asus, philips,
toshiba, acer, keyboard, kingston, genius, epson, lenovo, msi, xbox360, lite on, gigabyte, lexmark, anunturi, apc, belkin , packard bell,
delux, amd, elixir, placa video, bitdefender, spire, asrock, galaxy, pqi, kingmax, biostar, carcasa, hub hosting, dezvoltare it,
consumabile, imprimanta, placa de baza, flybook, innovision, infimax, optimizare, optimizare google, web design timisoara, optimizare
timisoara, hosting timisoara, calculatoare timisoara, calculatoare arad, web design arad, optimizare web arad, magazin de calculatoare arad,
magazin de calculatoare timisoara, it arad, it timisoara</center><center></div>

**alexdog1805** · 03-06-2010, 03:50 PM

if I put the top with px and not with % the image will change dimensions when I change the resolution of the monitor

**stringcugu** · 03-07-2010, 08:06 AM

if you want the image stay the same change the
width="100%" height="100%"
--------TO------------
width="100" height="100" image stays the same try that

**alexdog1805** · 03-09-2010, 12:10 AM

Originally Posted by stringcugu

if you want the image stay the same change the
width="100%" height="100%"
--------TO------------
width="100" height="100" image stays the same try that

if I do in that way the size of the image will change when it change the monitor rezolution.....

**Deadweight** · 03-09-2010, 12:49 PM

here i think this is what u need

css (try taking out the
<style type="text/css">

</style>
because it is an extrenal style sheet.)
i thank that would help a lil

body {padding:0;margin:0}

#banner img {position:absolute;width:100%;margin:auto;border-bottom:1px solid;border-color:black;}

#pozacentrusus {position:absolute;width:100%;margin:auto;}

#pozastanga {position:absolute;width:20%;margin-top:5%}

#pozadreapta {position:absolute;position:absolute;margin-left:80%;width:20%;height:40%;top:200px}

#pozacentrujos {position:absolute;margin-top:10%;width:100%;height:5%;border-bottom:1px solid;border-color:black;}

#cuvintecheie {color:grey;width:100%}

html:

<div id="banner" align="center"><img src="images/banner.gif"></div>

<div id="pozacentrusus" align="center"><img src="images/shape46617375.gif" width="100%" height="5%"></div>

<div id="pozastanga"><img src="images/bigfinal.jpg" width="100%" height="50%"><br><br><img src="images/final.jpg" width="100%"

height="30%"></div>

<div id="pozadreapta"><img src="images/bigfinal.jpg" width="100%" height="100%"></div>

<div id="pozacentrujos" align="center"><img src="images/shape46634046.gif" width="100%" height="100%"></div>

<div id="cuvintecheie">
<center>html, php, forum, v-mark, his, pc, d-link, microsoft, sony,hp, creative, dell, web design, hosting, lg,

samsung, inscrierea ava, ibm, printer, desktop, seo, mouse, ip-time, intel, gaming, horizon, laptop, notebook, director web, asus, philips,

toshiba, acer, keyboard, kingston, genius, epson, lenovo, msi, xbox360, lite on, gigabyte, lexmark, anunturi, apc, belkin , packard bell,

delux, amd, elixir, placa video, bitdefender, spire, asrock, galaxy, pqi, kingmax, biostar, carcasa, hub hosting, dezvoltare it,

consumabile, imprimanta, placa de baza, flybook, innovision, infimax, optimizare, optimizare google, web design timisoara, optimizare

timisoara, hosting timisoara, calculatoare timisoara, calculatoare arad, web design arad, optimizare web arad, magazin de calculatoare arad,

magazin de calculatoare timisoara, it arad, it timisoara</center></div>

**alexdog1805** · 03-11-2010, 08:19 PM

the problem is this

for example)

#pozadreapta {margin-top:-37%;margin-left:80%;width:20%;height:40%}

#pozacentrujos {margin-top:25%;width:100%;height:5%;border-bottom:1px solid;border-color:black;}

if in the css code #pozacentrujos is below #pozadreapta like the example before, in the html the div pozacentrujos will consider margin-top:0 the distance between pozadreapta div not margin-top:0 from the start of the screen.how can I fix that?

**alexdog1805** · 03-24-2010, 04:32 PM

now I have problems with the text.in what should I exprime the writing to remain at the same size and format when I change the monitor rezolution?in what dimensions is better to write?px, em or % ?

**BLiZZaRD** · 03-24-2010, 06:41 PM

There's a question. But I have another one.. Why do you want your text to remain the same size no matter the resolution? You only want people with 20/20 vision to look at your stuff?

People with low resolutions, bad eyesight, or crappy monitors need the flexibility of being able to increase text size for their benefit.

With that said, read this article as it covers all the methods of sizing text and how to best go about it.

Personally I would stick to px, because they are easier to re-size, and I would rather have someone read my words and ruin my layout on their screen than the other way around.

Thread: css div problem

Thread Tools

Search Thread

css div problem

Bookmarks

Bookmarks

Posting Permissions