two lists in one line

I have two lists in my page. I want to have them in one line. My code is:

<html>
<head><title>my first page</title></head>
<body>
<ul>
<li>apple
<li>cherry
<li>peach
<li>apricot
</ul>
<ol>
<li>tomato
<li>cucumber
<li>carrot
<li>beetroot
</ol>
</body>
</htm>

Feb 24 '07 #1

Subscribe Post Reply

7817

xwero

I have two lists in my page. I want to have them in one line. My code is:

<html>
<head><title>my first page</title></head>
<body>
<ul>
<li>apple
<li>cherry
<li>peach
<li>apricot
</ul>
<ol>
<li>tomato
<li>cucumber
<li>carrot
<li>beetroot
</ol>
</body>
</htm>

use the css style float.

Expand|Select|Wrap|Line Numbers

ul, ol { float:left; }

Feb 24 '07 #2

Eglute

I am only the beginner in html and I don't understand how to use the css style. Maybe you can write a code for me? Thank you.

Eglute

Feb 24 '07 #3

xwero

[HTML]
<html>
<head><title>my first page</title></head>
<style>
ul, ol { float:left; }
</style>
<body>
<ul>
<li>apple
<li>cherry
<li>peach
<li>apricot
</ul>
<ol>
<li>tomato
<li>cucumber
<li>carrot
<li>beetroot
</ol>
</body>
</htm>
[/HTML]
I used the style tag for this but if you want to style your whole website it's best to separate the css code from the html code.

Feb 24 '07 #4

xwero

The real one line code

[HTML]
<html>
<head><title>my first page</title></head>
<style>
/* remove browser standard behavoir */
ul,ol {margin:0;padding:0}
/* put the lists and list elements on one line */
ul, ol, li { float:left;display:block; }
/* put some space between the list items */
li {padding-left:10px;}
</style>
<body>
<ul>
<li>apple
<li>cherry
<li>peach
<li>apricot
</ul>
<ol>
<li>tomato
<li>cucumber
<li>carrot
<li>beetroot
</ol>
</body>
</htm>
[/HTML]

Feb 24 '07 #5

Eglute

Thanks. This way to solve my problem is very interesting. As for me I used table to solve the problem, but this way is longer than your. Thanks

Eglute

Feb 24 '07 #6

xwero

Thanks. This way to solve my problem is very interesting. As for me I used table to solve the problem, but this way is longer than your. Thanks
Eglute

A tables layout is bad practice if you don't need it. Everything can be positioned with css.

Feb 24 '07 #7

AricC

1,892

Expert 1GB

Thanks. This way to solve my problem is very interesting. As for me I used table to solve the problem, but this way is longer than your. Thanks
Eglute

Tables should be used for data only if anything at all eg. populate a table from a database.

Feb 24 '07 #8

Similar topics

Lists, tuples and memory.

by: Elbert Lev | last post by:

Hi, all! Here is the problem: I have a file, which contains a common dictionary - one word per line (appr. 700KB and 70000 words). I have to read it in memory for future "spell checking" of the...

Python

Dynamic Lists, or...?

by: Lorn | last post by:

I'm trying to figure out a way to create dynamic lists or possibly antother solution for the following problem. I have multiple lines in a text file (every line is the same format) that are...

Python

Definition lists as question/answer lists

by: Dave H | last post by:

Hello, I have a query regarding definition lists. Is it good practice semantically to use the dt and dd elements to mark up questions and answers in a frequently asked questions list, or FAQ? ...

HTML / CSS

performance degradation when looping through lists

by: Joachim Worringen | last post by:

I need to process large lists (in my real application, this is to parse the content of a file). I noticed that the performance to access the individual list elements degrades over runtime. This...

Python

Searching and manipulating lists of tuples

by: MTD | last post by:

Hello, I'm wondering if there's a quick way of resolving this problem. In a program, I have a list of tuples of form (str,int), where int is a count of how often str occurs e.g. L = would...

Python

spacing and positiong: lists (ul li)

by: mno | last post by:

Hi all, I have a problem that I've been stuck with for the last couple of days that's driving me a bit more than crazy at this point. Sorry if this message is not very clear. I have a design...

HTML / CSS

Mergesort algorithm for linked lists

by: Joerg Schoen | last post by:

Hi folks! Everyone knows how to sort arrays (e. g. quicksort, heapsort etc.) For linked lists, mergesort is the typical choice. While I was looking for a optimized implementation of mergesort...

C / C++

Select Lists -vs- Tables

by: Richard Maher | last post by:

Hi, Sorry if this is one of those issues that people feel passionate about and I assure you I'm not trolling but rather seeking guidance on which way to go with the web browser presentation of...

Javascript

Nested Lists

by: James | last post by:

I'm having trouble trying to put 3 definition lists into a unordered list which has been styled to appear horizontally. My goal is to have the 3 definition lists appear side by side and fill the...

HTML / CSS

read file into list of lists

by: antar2 | last post by:

Hello, I can not find out how to read a file into a list of lists. I know how to split a text into a list sentences = line.split(\n) following text for example should be considered as a...

Python

Wordpress or something else?

by: Faith0G | last post by:

I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...

Content Management Systems

Easy Steps to Fix "Canon Printer Won't Connect to WiFi Network"

by: taylorcarr | last post by:

A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...

General

How to turn on java script in a villaon keypad mobile phone

by: Charles Arthur | last post by:

How do i turn on java script on a villaon, callus and itel keypad mobile phone

Java

Basic Javascript concepts

by: aa123db | last post by:

Variable and constants Use var or let for variables and const fror constants. Var foo ='bar'; Let foo ='bar';const baz ='bar'; Functions function $name$ ($parameters$) { } ...

Javascript

Batch import of multiple excel files into the database

by: ryjfgjl | last post by:

If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...

Data Management

Merging data from multiple Excel files

by: ryjfgjl | last post by:

In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...

Data Management

Navigating the Data Structures and Algorithms (DSA)

by: BarryA | last post by:

What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...

Algorithms / Advanced Math

Looking to do Android software development, any suggestions? Is flutter better?

by: nemocccc | last post by:

hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?

General

How to build RAID in BIOS?

by: Hystou | last post by:

There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...

Computer Hardware