Solved

question about coloring a the background

Posted on 2009-05-15
5
154 Views
Last Modified: 2013-11-19

Hello group,

In following code I have assigned a color to an "option 3" background but when I get to the page more than the length of it is colored. Instead of "Option 3" it  is like  "Option 3        "

how can I trim it?!

Thanks,
ak

<ul class="menu_style">
            	<li><a href="1.html">Option 1 </a></li>
            	<li><a href="2.html">Options 2</a></li>
		<li style="background:#6699CC;"><a href="3.html">Option 3</a></li>
                <li><a href="4.html">Option 4</a></li>
            </ul>

Open in new window

0
Comment
Question by:akohan
5 Comments
 
LVL 2

Accepted Solution

by:
divstar earned 250 total points
ID: 24400607
Simple change the scope of the style attribute to the link only :o)
<ul class="menu_style">
                <li><a href="1.html">Option 1 </a></li>
                <li><a href="2.html">Options 2</a></li>
                <li><a href="3.html" style="background:#6699CC;">Option 3</a></li>
                <li><a href="4.html">Option 4</a></li>
            </ul>

Open in new window

0
 
LVL 2

Expert Comment

by:Tosko
ID: 24400608
change
<li style="background:#6699CC;">
into (or change the width to w/e number you like)
<li style="background:#6699CC; width:60px;">

Hope that this solved your problem
0
 
LVL 42

Expert Comment

by:David S.
ID: 24400611
It sounds like you gave the <a> display:block. Give it float:left instead.
0
 

Author Closing Comment

by:akohan
ID: 31582141

Thanks
0
 

Author Comment

by:akohan
ID: 24400956


Thanks to all for your responses.
0

Featured Post

Courses: Start Training Online With Pros, Today

Brush up on the basics or master the advanced techniques required to earn essential industry certifications, with Courses. Enroll in a course and start learning today. Training topics range from Android App Dev to the Xen Virtualization Platform.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Bootstrap show icon when mobile text when computer or tablet 3 38
CSS issue 8 31
paypal ipn url 5 57
Place text over image using CSS 6 44
This is a PowerShell web interface I use to manage some task as a network administrator. Clicking an action button on the left frame will display a form in the middle frame to input some data in textboxes, process this data in PowerShell and display…
This article discusses four methods for overlaying images in a container on a web page
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

776 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question