- This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
Viewing 2 posts - 1 through 2 (of 2 total)
- The forum ‘CSS’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
Greetings, folks,
I recently returned to web design after about 9 or so years on hiatus. I see a lot has changed, including the use of DIV. I seem to have a grasp on most things, but I’ve hit a road block I can’t quite get around. I’m trying to create a layout page similar to this:
| Na | Se |
| Banner |
| Content |
| Footer |
This is the code I’m using:
<style>
*
{
margin: 0em;
}
#nav
{
float: left;
left: 10em;
padding: 1em 0em;
position: relative;
}
#section
{
float: right;
right: 10em;
padding: 1em 0em;
position: relative;
}
#banner
{
background: url(images/banner-01.jpg) no-repeat center;
background-size: cover;
padding: 10em 0em;
position: relative;
}
#footer
{
background-color: black;
color: white;
clear: both;
text-align: center;
}
</style>
I can’t figure out why the div banner is overlapping with nav and section divs. Any help is greatly appreciated!
Hi,
At a quick glance, a lack of clears or floats on your #banner
is probably the cause. Defining some widths might help structure the layout too.