1 reply [Last post]
JoJodoggy1
JoJodoggy1's picture
Offline
newbie
Last seen: 5 years 19 weeks ago
Timezone: GMT-7
Joined: 2015-02-15
Posts: 3
Points: 6

I am very rusty with CSS after having not done it in about 7 years. I am trying to create a design in which there will be a left aligned navigation menu (to appear on every page). No matter how I edit the code, the links are appearing very widely spaced apart. They are aligning vertically like I want, however the space in between is way too much no matter how I edit the padding dimensions.

/* Left Nav Style*/
 
#Leftnav ul li {
     font-size: 18px;     
     text-align: left;
     padding: 0px
     display: inline-block;     
}
 
#Leftnav ul li a {
     padding: 3px 6px;
     font-weight: bold;
 
 }
 
#Leftnav div {
     background-color: #FFFFFF;
     display: inline-div;
     margin-bottom: 10px;
     display: block;	
}

Also I created a table that I want to align to the right of the page. I read it is bad practice to align using float so I tried this but it does not make any difference:

/*  Table Style */
 
#Products table {
     width: 100%
     text-align: right
     display: inline-table
}
 
#Products table, th, td {
    border: 1px solid black;
}
 
#Products th,td {
    padding: 15px;
    background-color: #FFFFFF;
}

Also, in both, the background colors I set are not appearing (which should be white against a colored background I set for the body.)

Thank you for looking at this!

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 7 hours 2 min ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5343
Points: 2964

Hi JoJodoggy1, Have you

Hi JoJodoggy1,
Have you tried removing the margin from the LI ?