התחבר | הרשמה | שאלות נפוצות
Anonymous

CSS Footer Menu

+ פרסם תגובה

3 הודעות עמוד 1 מתוך 1


CSS Footer Menu

על ידי alessandrofoglia » ג' פברואר 07, 2017 1:40 pm

Hi there,

I am a HTML / CSS newbie, and I am trying to install some code on my site which will provide me with a simple menu in the footer.

I got some HTML and CSS from a website which seems to work. However at the same time it also affects the structure of the top main menu at the same time.

Can anyone please advise how I can focus the CSS I found to focus on the footer menu HTML only?


Here is the CSS I have been using:

div.footermenu {width:100%;}
ul {width:100%; list-style:none;}
ul li {float:right; width:150px; font-weight:bold;}
ul li ul {padding:0;}
ul li ul li {float:none; padding:5px 0; font-weight:normal;}


Here is the HTML:

<div class="footermenu">
<ul>
<li>Home</li>
<li>About Us</li>
<li>Contact Us</li>
</ul>
</div>


Thanks.
סמל אישי של המשתמש

alessandrofoglia

  • הודעות: 1
  • הצטרף: ג' פברואר 07, 2017 1:22 pm

Re: CSS Footer Menu

על ידי Farhin Qureshi » ג' פברואר 21, 2017 12:46 pm

Hi,
to change the footer settings you will get a good example in below link
https://www.w3schools.com/html/html_layout.asp
סמל אישי של המשתמש

Farhin Qureshi

  • הודעות: 45
  • הצטרף: ג' ינואר 03, 2017 11:33 am
--
Farhin Qureshi
.NET Developer
http://www.ifourtechnolab.com

Re: CSS Footer Menu

על ידי sanmison » א' יולי 16, 2017 11:57 am

You simply need to add class before your ul li something like this,

.footermenu ul {width:100%; list-style:none;}
.footermenu ul li {float:right; width:150px; font-weight:bold;}
.footermenu ul li ul {padding:0;}
.footermenu ul li ul li {float:none; padding:5px 0; font-weight:normal;}

to avoid affecting Head menu,

of course it is not elegant solutions but should work (I don't know how looks your head menu).
סמל אישי של המשתמש

sanmison

  • הודעות: 6
  • הצטרף: א' יולי 09, 2017 7:14 pm
  • מיקום: Poland


+ פרסם תגובה

עמוד 1 מתוך 1