Welcome to WebmasterWorld Guest from 54.205.170.21

Forum Moderators: not2easy

Message Too Old, No Replies

Placing boxes beneath BrotherCake's UDM4 navigation

Attempting to position boxes beneath navigation without absolute position

   
3:54 pm on Jul 2, 2006 (gmt 0)

10+ Year Member



I have a site which uses BrotherCake's UDM4 navigation. Using absolute positioning, I am able to place items below the navigation but there is overlap in some browsers and when text size is increased. When I try to position the boxes within a div that wraps the UDM4, they stack over the navigation.

Basically I need some hints on placing items under the UDM4.

[html sample]

<ul id="udm" class="udm">
<li><a href="index.htm">Home</a>
<ul style="width:12.5em">
<li><a href="blah/index.htm">Blah</a></li>
</ul>
</li>
</ul>
</div>
<div id="boxes">
<div id="work">
<h4>Nifty Title</h4>
<p><a href="nifty.htm">Nifty Link</a></p>
</div>
<div id="info">
<h4>Information Title</h4>
<p>Information Copy</p>
</div>
</div>

[css sample]

#boxes {
position: absolute;
left: 52px;
top: 426px;
width: 140px;
}
* html #boxes {
top: 388px;
}
#work {
background: #f7efe2;
border: 1px solid #e39e3e;
font-size: 80%;
position: relative;
width: 140px;
}
#work h4 {
color: #187f47;
font-family: Arial, Lucida, Helvetica, sans-serif;
font-size: 95%;
line-height: normal;
padding-top: 6px;
}
#work p {
line-height: 140%;
padding: 4px 4px 0 4px;
}
#info {
background: #ecf3eb;
border: 1px solid #accdb8;
font-size: 80%;
margin-top: 8px;
position: relative;
width: 140px;
}
#info h4 {
color: #187f47;
font-family: Arial, Lucida, Helvetica, sans-serif;
font-size: 95%;
line-height: normal;
padding-top: 10px;
}
#info p {
line-height: 140%;
}

[The UDM4 css out of the box with positioning/size tweaking]

Thanks.

11:58 pm on Jul 2, 2006 (gmt 0)

5+ Year Member



Are you using Internet Explorer to test
this out or Fire Fox?
12:55 pm on Jul 3, 2006 (gmt 0)

10+ Year Member



I have checked on IE6, IE7 beta, Firefox on windows, Firefox on linux, Opera 9 on windows, and Netscape 8.1 on windows. Being able to place the boxes beneath the navigation relatively positioned would negate my need to cross browser hack.
 

Featured Threads

Hot Threads This Week

Hot Threads This Month