Home Web Front-end H5 Tutorial How to implement date and title right alignment in li tag

How to implement date and title right alignment in li tag

May 18, 2018 pm 05:17 PM
Alignment date title


I hope that the title will be aligned to the left and the date will be aligned to the right. When float:right is directly added to the span of the date, both IE8 and FF will be OK, but IE6/7 will wrap the line. Here is a simple and effective solution.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head>
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   <title></title>
<style>
<!--

#mylist { width:400px; list-style-type:none; margin:0; padding:0; }
#mylist li span {
        float:right; 
}
--> 
</style> 
</head> 
<body> 
<ul id="mylist">

        <li><span>2011-12-2</span>Web开发者网络(Admin10000.com)</li>
        <li><span>2011-12-2</span>Web开发者网络(Admin10000.com)</li>
        <li><span>2011-12-2</span>Web开发者网络(Admin10000.com)</li>         
</ul>

</body> 
</html>
Copy after login

Note: You need to write span at the front of the Li tag, so that the date in span can be right-aligned in versions before IE6/IE7/FF3.5.




The above is the detailed content of How to implement date and title right alignment in li tag. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

How to search previous Weibo by date on Weibo_How to search previous Weibo by date on Weibo How to search previous Weibo by date on Weibo_How to search previous Weibo by date on Weibo Mar 30, 2024 pm 07:26 PM

1. First open the mobile web browser, search for the Weibo web version, and click the avatar button in the upper left corner after entering. 2. Then click Settings in the upper right corner. 3. Click the version switching option in settings. 4. Then select the color version option in the version switch. 5. Click Search to enter the search page. 6. After entering the keywords, click Find People. 7. When the search completion interface appears, click Filter. 8. Finally, enter the specific date in the release time column and click Filter.

How to remove the date that appears automatically when printing from PPT handouts How to remove the date that appears automatically when printing from PPT handouts Mar 26, 2024 pm 08:16 PM

1. Let me first talk about the method I used at the beginning, maybe everyone is using it too. First, open [View]——]Remarks Template[. 2. A place where you can actually see the date after opening it. 3. Select it first and delete it. 4. After deleting, click [Close Master View]. 5. Open the print preview again and find that the date is still there. 6. In fact, this date was not deleted here. It should be in the [Handout Master]. Look at the picture below. 7. Delete the date after you find it. 8. Now when you open the preview and take a look, the date is no longer there. Note: In fact, this method is also very easy to remember, because the printed handouts are handouts, so you should look for the [Handout Master].

How to generate k random dates between two dates using Python? How to generate k random dates between two dates using Python? Sep 09, 2023 pm 08:17 PM

Generating random data is very important in the field of data science. From building neural network predictions, stock market data, etc., date is usually used as one of the parameters. We may need to generate random numbers between two dates for statistical analysis. This article will show how to generate k random dates between two given dates using the random and datetime modules. Datetime is Python’s built-in library for handling time. On the other hand, the random module helps in generating random numbers. So we can combine random and datetime modules to generate a random date between two dates. Syntax random.randint (start, end, k) random here refers to the Python random library. The randint method uses three important

C++ object layout is aligned with memory to optimize memory usage efficiency C++ object layout is aligned with memory to optimize memory usage efficiency Jun 05, 2024 pm 01:02 PM

C++ object layout and memory alignment optimize memory usage efficiency: Object layout: data members are stored in the order of declaration, optimizing space utilization. Memory alignment: Data is aligned in memory to improve access speed. The alignas keyword specifies custom alignment, such as a 64-byte aligned CacheLine structure, to improve cache line access efficiency.

Super complete! Six ways to get the 'day of the week' for a certain date in Python! Super complete! Six ways to get the 'day of the week' for a certain date in Python! Apr 19, 2023 am 09:28 AM

When performing data analysis in Python, it is also necessary to group and summarize by date, for example, to find the periodic pattern of sales volume. Then before using Python for data statistics, you need to add an extra step: get the day of the week from the specified date. For example, February 22, 2022, happens to be the 22nd Tuesday of the first lunar month, so there are particularly many people registering for marriage on this day. This article takes 2022-02-22 as an example to demonstrate 6 ways to get the "day of the week" for a specified date in Python! The weekday() datetime module is a Python built-in library that does not require pip installation. In addition to displaying date and time, it can also perform date and time calculations and formatting.

How to display date and seconds in the top bar of Ubuntu 17.10? How to display date and seconds in the top bar of Ubuntu 17.10? Jan 08, 2024 am 10:41 AM

By default, the top bar of Ubuntu 17.10 only has the current time and no date. What should I do if I want to display the date? Let’s take a look at the detailed tutorial below. 1. Open the terminal in the launcher, or press [Ctrl+Alt+T] 2. Enter in the terminal: sudoaptinstallgnome-tweak-tool 3. After the installation is completed, open the tweak tool 4. Click TopBar 5. Date is the date and seconds is the number of seconds 6. After setting it up, the date and seconds will be displayed on the time in the top bar.

How to change the date into a pound sign in Excel How to change the date into a pound sign in Excel Mar 20, 2024 am 11:46 AM

Excel software has very powerful data processing functions. We often use excel software to process various data. Sometimes when we enter a date in an excel cell, the date in excel changes to a pound sign. How can we display the data normally? Let’s take a look at the solution below. 1. First, we put the mouse on the column width line between columns AB, double-click and adjust the column width, as shown in the figure below. 2. After the column is widened, we find that numbers are displayed in the cells instead of dates. This is definitely incorrect. Then we should check the format of the cells, as shown in the figure below. 3. Click the &quot;Number&quot; option in the &quot;Home&quot; tab, and click &quot;Other Number Format&quot; in the drop-down menu, as shown in the figure below.

How to use the time and date modules in Python How to use the time and date modules in Python Oct 16, 2023 am 08:11 AM

How to use the time and date modules in Python Introduction: In programming, dealing with time and dates are very common tasks. Python provides powerful time and date modules, making time and date operations easier and more convenient. This article will introduce the time and date modules in Python and provide specific code examples to help readers better understand and apply them. 1. Introducing the time and date module Python’s built-in time and date module is the datetime module. We need to introduce this module first.

See all articles