Bibliography

I’m inserting a bibliography in certain pages of a site so the sources can be seen by readers. Any suggestions on the best way to indent the second line of each bibliography entry?

Thanks in advance,

Steve

Hi reedbird8. Welcome to the forums. :slight_smile:

You could put left padding on the text, and then have a negative text-indent. E.g.


<!DOCTYPE html>
<html lang="en">

<head>

<meta charset="utf-8">

<title>indented list items</title>
	
<style media="all">
ul, li {margin: 0; padding:0; list-style: none;}
li {padding-left:20px; text-indent: -20px;}
</style>
	
</head>

<body>
<ul>
<li>This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. </li>
<li>This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. </li>
<li>This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. </li>
<li>This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. This is a list item. </li>
</ul>
</body>

</html>


Thanks, Ralph! Didn’t think about using padding and a negative indent on first line. Good call. I set it up as a class in my css so its easy for me to repeat on any page I want to use a bibliography. I went with

<p class="biblio">bibliography item</p>

and put

.biblio { padding-left:20px; text-indent: -20px; }

in my .css file.

Yep, that’s fine too. I just used a list because it sort of is a list of references. :slight_smile:

Yeah, I may use it that way, too. One of the two pages where I wanted to use it now only has one source. Eventually, the list format may be the more economical for me to use. Just have to decide what to name everything in the CSS file to seperate it from other lists.

Thanks again, Ralph!

Probably the safest thing is to give it a class of “bibliography” (or a contraction thereof). That would make it pretty clear later on what it relates to. :slight_smile:

Oddly, no matter what I try, when I put it in list format, it wants to bullet everything… I thought “list-style: none;” should have taken care of that…

Indeed it should. There must be an error in there somewhere.

Got it figured out. The “#main_wrapper” in my css file was screwing it up. Had to add it that front of my “.biblio” since it occurs within <div id=“main_wrapper”>. There is a default set for lists in the main_wrapper to use a specific bullet, so I had to override that. Works now. What I did is below.

/* bibliography list */
#main_wrapper .biblio,
#main_wrapper .biblio ul,
#main_wrapper .biblio li,
#main_wrapper .biblio * {
	margin: 0;
	padding: 0;
	list-style: none;
}
#main_wrapper .biblio li {
	padding-left: 20px;
	text-indent: -20px;
	margin-bottom: 10px;
}

Cool. Glad you found a solution. :slight_smile:

Thanks for your help! Random thought…is there any way for it to automatically sort the items listed in alphabetical order? Or is this a thing where I have to always make sure I type them in the exact order I want?

No, not with straight HTML/CSS. (I’m not aware of a way to do it with programming, but hesitate to say it’s impossible.)

I kind of thought not…but I also figured it would be an interesting question to ask!