/    Sign up×
Community /Pin to ProfileBookmark

How to create div inside div using CC3 Menu

Copy linkTweet thisAlerts:
Oct 23.2013

Can anyone tell me how to create CSS3 menu with Div inside Div tag.

something like this i want-

[ATTACH=CONFIG]15825[/ATTACH]

I just want to know where can i get a code snipes or where i can learn that type of coding.. so i can implement that part in my menu style.

I tried looking a lot i got some examples but i was unable to extract that code part and was unable to implement that in my code.

My coding aim is to implement big number of menu item in one sub-menu.. like above image.

[canned-message]attachments-removed-during-migration[/canned-message]

to post a comment
HTML

3 Comments(s) ↴

Copy linkTweet thisAlerts:
@priyankagoundOct 23.2013 — Below is the code for using div inside div:

#Div1

{

width:800px;

margin:0 auto;

overflow:hidden;

float:left;

}

#Div2

{

width:100%;

float:left;

}

#Div3

{

width:100%;

clear:both;

}

#Div4, #Div6

{

float:left;

width:30%;

}

#Div5

{

float:left;

width:40%;

}

#Div7

{

width:70%;

margin:50px auto;

}

Now you can add your menus inside the above or can follow with the below link example which has worked great for me:

http://jsfiddle.net/5nGYS/15/#run

Hope this helps.
Copy linkTweet thisAlerts:
@Major_PayneOct 23.2013 — The CSS on jsfiddle.net example validates as CSS3. The HTML shows you how the div within a div is coded for the menus. Guess I'm not understanding the problem as the example can be modified however you want. Maybe these might help:

See following sites for navigation menus:

CSS Library Horizontal CSS Menus: http://www.dynamicdrive.com/style/csslibrary/category/C1/

CSS Library Vertical CSS Menus: http://www.dynamicdrive.com/style/csslibrary/category/C2/

http://www.dynamicdrive.com/dynamicindex1/

http://www.cssplay.co.uk/menus/

How to Style an Unordered List with CSS: http://www.webreference.com/programming/css_style2/index.html

Sexy Drop Down Menu w/ jQuery & CSS: http://www.noupe.com/tutorial/drop-down-menu-jquery-css.html

NavDock jQuery Plugin (Ver 1.5.1): http://plugins.jquery.com/project/NavDock

Making CSS Rollover Buttons: http://www.elated.com/articles/css-rollover-buttons/

How To:

http://www.w3.org/TR/WCAG10-HTML-TECHS/#links

http://www.creativepro.com/article/dreamweaver-how-create-you-are-here-navigation-links

http://efuse.com/Design/navigation.html

Simple JQuery Accordion menu: http://www.i-marco.nl/weblog/jquery-accordion-menu/

Drop-Down Menus, Horizontal Style: http://www.alistapart.com/articles/horizdropdowns/

The Right Way to Make a Dropdown Menu: http://www.sitepoint.com/blogs/2009/04/01/the-right-way-to-make-a-dropdown-menu/
------------------------


Rounded Corner Menus:

How to Create an Interactive Rounded Navigation Menu with CSS: http://www.wikihow.com/Create-an-Interactive-Rounded-Navigation-Menu-with-CSS

CSS Rounded Corners Menus: http://www.virtuosimedia.com/dev/css/css-rounded-corners-menus

How To Make CSS Expanding Rounded Navigation Menus & Buttons: http://www.amberweinberg.com/how-to-make-css-expanding-rounded-navigation-menus-buttons/
×

Success!

Help @icode919 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.17,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...