Expiring Today—Celebrate National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

CSS Width

Posted on 2011-03-16
4
Medium Priority
?
274 Views
Last Modified: 2012-08-14
I have a background, that I want to make 55px in width.

This is the background for page numbers, so each page number will be in a box with the chosen background.

The current layout only shows the actual size with the number, but I want a fixed width.


.page_button 
{
background:url(images/page.png); 
background-width: 35px;
color: #FFFFFF;
font-family: Arial, Tahoma, Verdana;
font-size: 14px;
font-weight: bold !important;
text-decoration: none;
text-align:center;
margin: 0;
padding: 2px 2px 2px 2px !important;
border: 1px solid #000000; 
}

.page_button:hover {
background: #000000 !important;
border: 1px solid #000000;
}

.page_button a {
background-width: 35px;
text-align:center;
color:#fff;
}

Open in new window

0
Comment
Question by:Computer Guy
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
  • 2
4 Comments
 
LVL 16

Expert Comment

by:JF0
ID: 35149166
There is no background-width property for CSS. Just use width.
0
 
LVL 3

Author Comment

by:Computer Guy
ID: 35149180
I did, but it did not work.

changed background-width to width
0
 
LVL 16

Accepted Solution

by:
JF0 earned 2000 total points
ID: 35149660
can you show some html code so I can understand what is not working?
0
 
LVL 3

Author Comment

by:Computer Guy
ID: 35149977
Sure, there is a little PHP in it.
<style type="text/css">
.page_button 
{
	background:url(gallery/images/TEST_IMAGES/page.png); 
                     width: 35px;
	color: #FFFFFF;
	font-family: Arial, Tahoma, Verdana;
	font-size: 14px;
	font-weight: bold !important;
	text-decoration: none;
                     text-align:center;
                     margin: 0;
	padding: 2px 2px 2px 2px !important;
	border: 1px solid #000000;	}

.page_button:hover {
	background: #000000 !important;
	border: 1px solid #000000;
	}
.page_button a {
text-align:center;
color:#fff;}
</style>

	<?
	for ($i = 1; $i <= $pages; $i++) {
		if ($i > 1)
			echo '&nbsp;';
		if ($i == $page)
			echo '<span class="page_button"> ' . $i . '</span>';
		else
			echo '<span class="page_button"><a href="event.php?group=' . $group . '&event=' . $event .'&page=' . $i . '"> ' . $i . '</a></span>';
	}

	?>

Open in new window

0

Featured Post

Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

Question has a verified solution.

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

Creating a CSS block that only applies to printing By default, all of your CSS applies to every possible view of your page - whether on screen, printed, landscape, touch-screen, or whatever.  You can, however, add CSS that only applies under certai…
As a result of several questions about how to use Bootstrap I thought it would be a good idea to write down the development aspect of creating a Bootstrapped website in as little time as possible. Part 1 of this article will only concentrate on g…
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).
Suggested Courses

719 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