navigation
a webmaster learning community
     Home    Register     Search      Help      Login    
Sponsors

Shopping Cart Software
Ecommerce software integrated into Frontpage, Dreamweaver and Golive templates. No monthly fees and available in ASP and PHP versions.

Website Templates
We also have a wide selection of Dreamweaver, Expression Web and Frontpage templates as well as webmaster tools and CSS layouts.

Frontpage website templates
Creative Website Templates for FrontPage, Dreamweaver, Flash, SwishMax

Search Forums
 

Advanced search
Recent Posts

 Todays Posts
 Most Active posts
 Posts since last visit
 My Recent Posts
 Mark posts read

Microsoft MVP

 

Nested Divs for 2 background images

 
View related threads: (in this forum | in all forums)

Logged in as: Guest
Users viewing this topic: none
Printable Version 

All Forums >> Web Development >> Cascading Style Sheets >> Nested Divs for 2 background images
Page: [1]
 
rubyaim

 

Posts: 757
Joined: 6/22/2005
Status: offline

 
Nested Divs for 2 background images - 3/9/2006 0:44:27   
Hello everyone, I've had a long break from work, started back Monday, and seem to have forgotten everything :)

I'm working on a dropdown menu that a co-worker started (think it may have commenced life as a Suckerfish). We would like a background image as well as an image on the right to show when there are actually links in a dropdown.

Only way I could think to do this was by nesting divides, but am wondering if this is very poor coding and / or a very poor solution. Code below. Am still working on this, looks okay in FF and finally in IE, but I'd appreciate it if someone could suggest a better way to do this? I don't want code, but need help to start thinking once more.

CSS
.topblck{
border: 1px solid #cccccc;
background:url("grey.gif") repeat-x;
width:127px;
}

.mainlinks a{
font-weight: bold;
width:100%;
display:block;
text-align:center;
}

.expand{
background:url('expmnu.gif');
background-repeat:no-repeat;
background-position:right;
width:98%;
}

HTML
<li class="topblck">

<!-- nest div's for 2 background images -->
<div class="mainlinks">
<div class="expand">

<!-- main link -->
<a title="Full contact details for all Administration Staff" href="../admin/contact.asp">Contact Admin</a>

<!-- close divides -->
</div>
</div>

<!-- sub links-->
<ul class="sublinks">
<li>
<a title="Building Layout and Site Map for Head Office" href="../admin/maps.htm">Admin Maps</a>
</li>
</ul>
</li>

etc, etc


Thanks :)

_____________________________

Sally
Page:   [1]

All Forums >> Web Development >> Cascading Style Sheets >> Nested Divs for 2 background images
Page: [1]
Jump to: 1





New Messages No New Messages
Hot Topic w/ New Messages Hot Topic w/o New Messages
Locked w/ New Messages Locked w/o New Messages
 Post New Thread
 Reply to Message
 Post New Poll
 Submit Vote
 Delete My Own Post
 Delete My Own Thread
 Rate Posts