Archief - CSS: stom div probleem

Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.
r

ruttennicky

Legacy Member
Beste Mensen,

Ik ben bezig met het bouwen van een site (hooray) maar ik stuit op een stom probleempje met een div. Ik heb dus in mijn groot content vlak 2 div's, een right (voor de menu's) en een left (voor de eigelijke content). Nu in mijn html staan ze zo gerangschikt :

<div id="content">

<div id="right"></div>

<div id="left"></div>

</div> -> Dit is al goed

Nu in mijn css staat de right op float:right en heeft een vaste breedte (de left ook). Als ik tekst plaats in deze right div, dan krijg ik een vervelende overflow van tekst :( en volgens dreamweaver moet dus de div groter zijn.

Klik hier

Kan iemand mij helpen ? (sorry voor dit n00b vraagje maar ... vind het wel stom).

Met vriendelijke groeten,
Nicky Rutten
B

BloodSeaker

Legacy Member
Zonder echt de code of de CSS ervan te zien is het best niet simpel om te zeggen waar het probleem zit, een schets zegt nl niet zoveel he.

Dus mss toch even de html en css even online smijten of hier posten?
r

ruttennicky

Legacy Member
Excuus

HTML :

HTML: 
<div id="container">
  <div id="heading"></div>
  
  
  <div id="content">
  	<div id="right">
	  <div id="right_content">fsdqfsqdfsqdfsqfsfsqfqs
	  fsqdfqsfsqfsqfsqdfqsfqs
	  fsfsq</div>
	</div>
   	<div id="left">
	  <div id="left_content">Content for  id "left_content" Goes Herefsdqfsqdfsqdfsqfsfsqfqs
	  fsqdfqsfsqfsqfsqdfqsfqs
	  fsfsqfsdqfsqdfsqdfsqfsfsqfqs
	  fsqdfqsfsqfsqfsqdfqsfqs
	  fsfsqfsdqfsqdfsqdfsqfsfsqfqs
	  fsqdfqsfsqfsqfsqdfqsfqs
	  fsfsqfsdqfsqdfsqdfsqfsfsqfqs
	  fsqdfqsfsqfsqfsqdfqsfqs
	  fsfsqfsdqfsqdfsqdfsqfsfsqfqs
	  fsqdfqsfsqfsqfsqdfqsfqs
	  fsfsqfsdqfsqdfsqdfsqfsfsqfqs
	  fsqdfqsfsqfsqfsqdfqsfqs
	  fsfsqfsdqfsqdfsqdfsqfsfsqfqs
	  fsqdfqsfsqfsqfsqdfqsfqs
	  fsfsqfsdqfsqdfsqdfsqfsfsqfqs
	  fsqdfqsfsqfsqfsqdfqsfqs
	  fsfsq</div>
	</div>

  </div>
  
  
  <div id="bottom"></div>
</div>

CSS :

HTML: 
#container #heading {
	background-image: url(../images/layout_01.gif);
	height: 215px;
	width: 900px;
}
#container {
	width: 900px;
	margin-right: auto;
	margin-left: auto;
}
#container #content {
	background-image: url(../images/layout_03.png);
	background-repeat: repeat-y;
}

body {
	background-color: #FFFFFF;
	margin: 0px;
	padding: 0px;
}
#container #bottom {
	background-image: url(../images/layout_05.gif);
	height: 94px;
	width: 900px;
	background-repeat: no-repeat;
}
#container #content #right {
	padding: 0px;
	margin-right: 120px;
	width: 50px;
	height: 100%;
	float: right;
}
#container #content #right #right_content {
	padding: 10px;
	height: 100%;
}

#container #content #left {
	width: 400px;
	margin-left: 35px;
	height: 100%;
}
U

UnD3RD0G

Legacy Member
zonder code te lezen :
zet je left en right div op position absolute en positineer ze dan?
r

ruttennicky

Legacy Member
Ja, nu met dieen position:absolute komen ze wel mooi op de plaats (in full screen dan toch) maar nu zit ik met het probleem dat mijn content vlak niet mee van grootte veranderd. Op de content div staat een breedte van 900px en een hoogte van 100%, maar als ik niets invul bij de hoogte krijg ik juist hetzelfde.

het probleem live : Mijn site

Groetjes,
Nicky
B

BloodSeaker

Legacy Member
Ik zie niet meteen het probleem eerlijk gezegd :/

Hoogte 100% op een div is een slecht idee, zeker als ge em groter wilt laten worden als de tekst langer wordt, gewoon geen hoogte opgeven dus.


Heb er niet veel tijd aan besteed, maar gebruik onderstaande CSS eens en kijk eens of dat is wat ge bedoelt?


Code: 
#container #heading {
	background-image: url(http://www.ruttennicky.com/dekelten/images/layout_01.gif);
	height: 215px;
	width: 900px;
}
#container {
	width: 900px;
	margin: 0 auto;
}
#container #content {

	background-image: url(http://www.ruttennicky.com/dekelten/images/layout_03.png);
	background-repeat: repeat-y;
	width: 900px;
}

body {
	background-color: #fff;
	margin: 0;
	padding: 0;
}
#container #bottom {
	background-image: url(http://www.ruttennicky.com/dekelten/images/layout_05.gif);
	height: 94px;
	width: 900px;
	background-repeat: no-repeat;
}
#container #content #right {
	padding: 0;
	width: 134px;
        margin: 0;
	margin-left: 740px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: medium;
	color: #333;
	font-weight: bold;
}

#container #content #left {
	width: 694px;
	margin: 0;
	margin-left: 120px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: x-small;
	color: #333;
	padding-right: 20px;
}
Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.
Terug
Bovenaan