container

Status
Niet open voor verdere reacties.
dejobse

dejobse

Gebruiker
Lid geworden
7 jul 2008
Berichten
722
okee,
ik heb een probleem met containers want die rotdingen die blijven staan in je scherm dus als de rest van een site verschuift omdat de resolutie kleiner word blijven de containers staan.

ik weet ondertussen dat je ze kan maken met procenten maar in dreamweaver wilt dat niet zo want als je dus de container moet verplaatsen staat hij al niet meer in procenten maar weer ik-n pixels


als iemand een vervang middel weet of hoe ik dit in dreamweaver kan aanpassen ofzo...

av thx.
 
Dejobse
Containers zijn divs.
In procenten wil zeggen dat ze zoveel % van het scherm innemen als je een div hebt van 80% dan is dat 80% van je scherm dus klein scherm of groot het blijft 80% op een klein scherm daarentegen schuift alles dan onder elkaar .
Geef eens de code html en css van je probleem dat we dat eens kunnen bekijken zal ons beter op helpen dan wat je nu schrijft.
Mvg
defietser
 
oke ik heb even een code gemaakt (deze is niet met procenten):

HTML: 
<html lang="nl">
<head>
<title>test...</title>

<style type="text/css">
div#container
{
   width: 770px;
   position: relative;
   margin-top: 0px;
   margin-left: auto;
   margin-right: auto;
   text-align: left;
}
</style>

</head>
<body>

<div id="wb_Text1" style="position:absolute; left:423px; top:98px; width:150px; height:14px; z-index:0" align="left">
<font style="font-size:11px" color="#000000" face="Arial">--testtext...</font></div>

</body>
</html>
 
dejobse zei:
als iemand een vervang middel weet of hoe ik dit in dreamweaver kan aanpassen ofzo...
Klik om te vergroten...

Kladblok ;)

Ik ken Dreamweaver verder niet, maar de output file is gewoon een tekst-file dus je kunt het desnoods na afloop met kladblok fixen.
Wel heel slecht overigens dat ie je percentage vervangt door een fixed aantal pixels :/
 
ja maar weet je, de containers bij deze pagine werken wel :S


HTML: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Compusystems-Emmen</title>
<meta name="generator" content="Dejobse - dejobse.110mb.com">
<style type="text/css">
div#container
{
   width: 770px;
   position: relative;
   margin-top: 0px;
   margin-left: auto;
   margin-right: auto;
   text-align: left;
}
body
{
	text-align: center;
	margin: 0;
	background-image: url(images/possible.jpg); background-repeat: no-repeat; background-position: 50% 0px;
}
</style>
<style type="text/css">
a.Style1:link
{
	color: #FFF;
	text-decoration: none;
}
a.Style1:visited
{
	color: #FFF;
	text-decoration: underline;
}
a.Style1:active
{
	color: #000;
	text-decoration: underline;
}
a.Style1:hover
{
   color: #000000;
   text-decoration: underline;
}
a:link {
	color: #FFF;
}
a:visited {
	color: #FFF;
}
a:active {
	color: #000;
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"></head>
<body bgcolor="#666666" text="#000000" style=
" tracingsrc="images/possible.jpg>
<div id="container">
<div id="wb_Image1" style="overflow:hidden;position:absolute;left:0px;top:85px;z-index:0" align="left">
<img src="images/sideBar_bg2.gif" id="Image1" alt="" align="top" border="0" style="width:150px;height:718px;"></div>
<div id="wb_Image2" style="overflow:hidden;position:absolute;left:0px;top:84px;z-index:1" align="left">
<img src="images/keyVisual_1.gif" id="Image2" alt="" align="top" border="0" style="width:126px;height:69px;"></div>
<div id="wb_Image3" style="overflow:hidden;position:absolute;left:126px;top:84px;z-index:2" align="left">
<img src="images/keyVisual_bg.gif" id="Image3" alt="" align="top" border="0" style="width:644px;height:69px;"></div>
<div id="wb_Image5" style="overflow:hidden;position:absolute;left:0px;top:153px;z-index:3" align="left">
<img src="images/navBar_bg.gif" id="Image5" alt="" align="top" border="0" style="width:770px;height:23px;"></div>
<div id="wb_Image7" style="overflow:hidden;position:absolute;left:0px;top:176px;z-index:4" align="left">
<img src="images/sideBar_bg1.gif" id="Image7" alt="" align="top" border="0" style="width:30px;height:25px;"></div>
<div id="wb_Text1" style="position:absolute; left:32px; top:181px; width:103px; height:118px; z-index:5" align="left">





  <span class="Style1"><font style="font-size:13px" color="#000000" face="Arial"><b><a href="index.htm" class="Style1">Home</a><br>
<br>
<a href="html/products.htm" class="Style1">Producten</a><br>
<br>
<a href="html/aanbiedingen.htm" class="Style1">Aanbiedingen</a><br>
<br>
<a href="html/contact.htm" class="Style1">Contact</a></b></font></span></div>

<div id="wb_Image8" style="overflow:hidden;position:absolute;left:0px;top:208px;z-index:6" align="left">
<img src="images/sideBar_bg1.gif" id="Image8" alt="" align="top" border="0" style="width:30px;height:25px;"></div>
<div id="wb_Image9" style="overflow:hidden;position:absolute;left:0px;top:240px;z-index:7" align="left">
<img src="images/sideBar_bg1.gif" id="Image9" alt="" align="top" border="0" style="width:30px;height:25px;"></div>
<div id="wb_Image10" style="overflow:hidden;position:absolute;left:0px;top:272px;z-index:8" align="left">
<img src="images/sideBar_bg1.gif" id="Image10" alt="" align="top" border="0" style="width:30px;height:25px;"></div>
<div id="wb_Text5" style="position:absolute; left:0px; top:34px; width:366px; height:49px; z-index:11; background-color: #CCCCCC; layer-background-color: #CCCCCC; border: 1px none #000000;" align="left">
  <font style="font-size:37px" color="#000000" face="Times New Roman">Compusystems-Emmen</font><font style="font-size:16px" color="#000000" face="Times New Roman"><br>
</font></div>
<div id="wb_Shape1" style="position:absolute; left:150px; top:177px; width:619px; height:624px; z-index:12" align="left">
<img src="images/img0001.gif" alt="" name="Shape1" width="619" height="624" border="0" align="top" id="Shape1" title=""></div>
<div id="wb_Image14" style="overflow:hidden;position:absolute;left:0px;top:800px;z-index:13" align="left">
<img src="images/navBar_bg.gif" id="Image14" alt="" align="top" border="0" style="width:770px;height:23px;"></div>
<div id="wb_Image15" style="overflow:hidden;position:absolute;left:181px;top:266px;z-index:14" align="left">
<img src="images/notebook.jpg" id="Image15" alt="" align="top" border="0" style="width:250px;height:250px;"></div>
<div id="wb_Text6" style="position:absolute; left:446px; top:265px; width:322px; height:32px; z-index:16" align="left">
  <p>Doet uw PC niet wat u wilt? Wacht u nog op familie of die kennis? Compusystems-Emmen helpt u snel, goedkoop en vakkundig bij uw PC-problemen. <br>
    Foto van de lianli kast op de plek van de laptop<br>
  </p>
  <p>&middot; Reparatie en onderhoud van uw PC <br>
    &middot; Installatie van uw internetaansluiting <br>
    &middot; Installatie van uw hard en software <br>
    &middot; (her)installatie van Windows <br>
    &middot; Installatie en beveiliging van uw(draadloos) netwerk <br>
    &middot; Verwijderen van virussen <br>
    &middot; Verkoop van hard- en software <br>
    &middot; Inruil oude PC mogelijk <br>
    &middot; Dus ook verkoop van gebruikte PC's <br>
    &middot; etc... etc... etc...<br>
  </p>
</div>
<div id="wb_Text8" style="position:absolute; left:120px; top:803px; width:619px; height:15px; z-index:18" align="left">
  <font style="font-size:11px" color="#000000" face="Arial">Copyright © 200 by &quot;Computersystems-emmen&quot;&nbsp; ·&nbsp; All Rights reserved&nbsp; ·&nbsp; E-Mail: </font>
  <font style="font-size:11px" color="#000000" face="arial">wivonne@orange.nl</font><font style="font-size:16px" color="#000000" face="Times New Roman"><br>
</font></div>
<div id="wb_Text9" style="position:absolute; left:194px; top:206px; width:527px; height:39px; z-index:19" align="left">
<font style="font-size:21px" color="#000000" face="Arial"><b>Welkom op de site van Compusystems-Emmen</b></font><font style="font-size:16px" color="#000000" face="Times New Roman"><br>
</font></div>
</div>
</body>
</html>
sorry dat hij misschien een beetje lang is ^^
 
Bestudeer dit maar eens.
Zie de toevoeging van de div container waarin de rest vervat zit.

Code: 
<html lang="nl">
<head>
<title>test...</title>

<style type="text/css">
#container
{
   width: 770px;
   position: relative;
   margin-top: 0px;
   margin-left: auto;
   margin-right: auto;
   text-align: left;
   border: 1px solid #000;
   height: 101%;
}
</style>

</head>
<body>
<div id="container">
<div id="wb_Text1" style="position:absolute; left:20px; top:20px; width:150px; height:14px; z-index:0; border: 5px solid #000">
<font style="font-size:11px" color="#000000" face="Arial">--testtext...</font></div>
<div id="wb_Text2" style="position:absolute; left:220px; top:20px; width:150px; height:14px; z-index:0; border: 5px solid red">
<font style="font-size:11px" color="#000000" face="Arial">--testtext2...</font></div>
<div id="wb_Text3" style="position:absolute; left:420px; top:20px; width:150px; height:14px; z-index:0; border: 5px solid lime">
<font style="font-size:11px" color="#000000" face="Arial">--testtext3...</font></div>
<div id="wb_Text4" style="position:absolute; left:610px; top:20px; width:150px; height:14px; z-index:0; border: 5px solid navy">
<font style="font-size:11px" color="#000000" face="Arial">--testtext3...</font></div>
</div><!-- sluit container -->
</body>
</html>

Poppoll
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan