[opgelost] div positioneren

Nederlandse ondersteuning voor CMS Made Simple

Moderator: velden

Locked
iStevo

[opgelost] div positioneren

Post by iStevo »

Ik wil graag een div met vaste waarden in het midden van mijn webpagina hebben.
Ik heb ook een shadow.png die aan deze div verbonden is.
Alles werkt, behalve de div in het midden van de pagina positioneren zonder gebruik van de oplossing.

Code: Select all

html {
	margin: 0px;
	padding: 0px;
}

body {
        background: #C6C6C4;
	color: #000;
}

#container {
	margin-top: 100px;
	width: 910px;
	height: 514px;
}

#subcontainer {
        background: #FFF url('uploads/images/shadow.png') no-repeat;
	width: 910px;
	height: 514px;
	overflow: hidden;
}

Code: Select all

{process_pagedata}
<!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" xml:lang="en" >
<head>
<title>{sitename} - {title}</title>
{metadata}
{stylesheet}
</head>

</__body>
<div id="container">
	<div id="subcontainer">test</div>
</div>
<__body>
</__html>
Last edited by iStevo on Tue Aug 03, 2010 8:16 am, edited 1 time in total.
Top
deactivated010521

Re: div positioneren

Post by deactivated010521 »

----------
Last edited by deactivated010521 on Tue Mar 12, 2013 4:09 pm, edited 2 times in total.
Top
iStevo

Re: div positioneren

Post by iStevo »

hoi arnoud,
bedankt voor jouw antwoord. Kan je me nog verklaren waarom in onderstaande code zelfde resultaat wordt geboekt zodat ik iets uit kan leren??

Code: Select all

html {
	margin: 0px;
	padding: 0px;
}

body {	
        margin: 0px;
	padding: 0px;
	background: #000;
	color: #FFF;
}

#container_holder{
	width: 1000px;
        height: 99%; 
	margin: 0 auto;
	background: #000;
	overflow: hidden; 
}

#content_holder {
	margin-top: 50px;
}

#header {
        width: 180px;
	height: 100%; 
	float: left;
	background: #000; 
}

#menu {
	width: 230px;
        height: 99%;
	float: left;
	background: #000;
}

#content {
	width: 590px;
	height: 100%; 
        background: #000;
	float: left;
       	overflow: scroll;
	overflow-x: hidden;
	overflow-y: auto;
}	

#footer_holder {
        width: 99%;
        margin-top: 80px;
        float: left;
        border-top: 1px dashed;
        font-size: 9px;
        font-family: Verdana, Arial, Comic Sans Ms, sans-serif;
}

#footer_copyright {
        width: 49%;
        float: left;
}

#footer_links {
        width: 49%;
        text-align: right;
        float: right;
}

.container {
	width: 1000px;
        height: 99%; 
	margin: 0 auto;
	background: #000;
	overflow: hidden; 
}

.content {
	padding: 30px 10px 10px 10px;
        font-size: 12px;
        font-family: Verdana, Arial, Comic Sans Ms, sans-serif;
}
Top
User avatar
M@rtijn
Power Poster
Power Poster
Posts: 706
Joined: Sat Nov 14, 2009 4:54 pm

Re: div positioneren

Post by M@rtijn »

Waarschijnlijk deze regel:

Code: Select all

.container {
	margin: 0 auto;
Make your community a better place!
Top
iStevo

Re: div positioneren

Post by iStevo »

dat is het inderdaad. En ik zit daar dan uren op te zoeken.
Bedankt voor de hulp. Is er ook een mogelijkheid om

margin: 0 auto; en margin-top: 50px; in 1 div onder te brengen?
Top
Jos
Support Guru
Support Guru
Posts: 4019
Joined: Wed Sep 05, 2007 8:03 pm

Re: div positioneren

Post by Jos »

Dat kan met:

Code: Select all

margin: 50px auto 0 auto;
De 4 waarden werken op de zijdes met de klok mee, van boven, rechts, onder, links
Top
iStevo

Re: div positioneren

Post by iStevo »

thx Jos, ik had het net ook gevonden.
Ik was gewoon aan het twijfelen ivm 'auto'
Top
Locked

Return to “Dutch - Nederlands”