...

View Full Version : Text outside of div



manda
02-18-2012, 10:13 PM
Hi, I'm an absolute newbie to css so I do apologise if this seems very simple but I can't figure it out. The problem is that any long text goes beyond the div, how do I get the div to fit to the amount of text? Also, the wrapper only goes half way down the page when it is set to 100% and I'd like it to go all the way to the bottom so the colour of it can be seen. Here is the code (hopefully):





html, body{
background-color: #C33;
margin: 0px;
height: 100%;
}


#wrapper {
width: 1024px;
background-color: #000;
height:100%;
min-height:100%;
margin: 0 auto;
overflow:visible;
border-radius: 5px;
-moz-border-radius: 5px;


}
#header {
height: 150px;
width: 1024px;
background-color: #000000;
border-radius: 5px;

-moz-border-radius: 5px;
background-image:url(Images/title2.jpg);
background-repeat:no-repeat;
background-position: 50% 50%;

}
#navbar {
height: 35px;
width: 1024px;
background-color: #D6D6D6;
border-radius: 5px;
-moz-border-radius: 5px;
margin-bottom: 3px;
}

#left {
float: left;
height: 100%;
width: 24%;
background-color: #000;
margin-bottom: 3px;
border-radius: 5px;
-moz-border-radius: 5px;
margin-right: 5px;
}
#middle {
height: 100%;
min-height:100%;
width: 51%;
background-color: #FFF;
float: left;
margin-bottom: 3px;
.
border-radius: 5px;
-moz-border-radius: 5px;
font-family: Verdana, Geneva, sans-serif;
}
#right {
float: right;
height: 100%;
width: 24%;
background-color: #000;
margin-bottom: 3px;
border-radius: 5px;
-moz-border-radius: 5px;
font-family: Verdana, Geneva, sans-serif;
color: #FFF;
}


#footer {
height:30px;
width:1024px;
background-color:#D6D6D6;
clear:both;
margin-right:auto;
margin-left:auto;
margin-top:-30px;
margin-bottom:-30px;
border-radius: 5px;
-moz-border-radius: 5px;

}


#navbar ul {
list-style-type: none;
margin: 0px;
padding: 0px;
}
#navbar ul li {
display: inline;
}
#navbar ul li a {
font-family: Verdana, Arial, Helvetica, sans-serif;
text-decoration: none;
float: left;
padding-top: 7px;
padding-right: 15px;
padding-bottom: 0px;
padding-left: 15px;
}
#navbar ul li a:hover {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #FFFFFF;
text-decoration: none;
float: left;
padding-top: 7px;
padding-right: 15px;
padding-bottom: 7px;
padding-left: 15px;
background-color: #999999;
}

miennh_coding
02-19-2012, 10:35 AM
html?

sunfighter
02-19-2012, 05:04 PM
manda I do not see these behaviors, but you need to give us the HTML code and tell us what div your having problems with. And what browsers have you looked at your page with.

teedoff
02-19-2012, 06:11 PM
We do need your html code, but in the mean time, try instead of setting a height on wrapper, set

overflow: auto;

on wrapper.

clausrei
02-20-2012, 01:03 PM
Or :
overflow:hidden

Or delete the #wrapper attribute for height:

height: 100%;

This should do the job.

Co1dFusion
02-20-2012, 01:56 PM
The problem is that you have specfied the height of the div. remove that and the div will just fit the text.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum