Learn VBA & Macros in 1 Week!

CSS - No Line Break On List

Full Excel VBA Course - Beginner to Expert

No Line Break On List	View Content

Below is my CSS file for list.
Code:

li {
   list-style-position: outside;
}
ul {   
   list-style-position: outside;
   list-style-type: disc;
   margin-left: 15;
}
ul ul {
   list-style-position: outside;
   list-style-type: circle;
   margin-left: 25px;

}
ol {
   list-style-position: outside;
   list-style-type: upper-alpha;

}
ol ol {
   list-style-position: outside;
   list-style-type: decimal;
   margin-left: 25px;

}

ol ol ol {
   list-style-position: outside;
   list-style-type: upper-alpha;
   margin-left: 35px;

}

Now, here's the problem. When I do this:

Code:

<b>Section Title</b>
<ul><li>List 1</li>
   <li>List 2</li>
   <li>List 3</li>
</ul>

The result showed up like this:

Section Title

*List 1
*List 2
*List 3

Is there a way to not having the line break after the "Section Title"? I want it to show up like this:

Section Title
*List 1
*List 2
*List 3

How to I take out the extra line break?

Any help is grateful!

ljCharlie

Full Excel VBA Course - Beginner to Expert

Removing Line Break After List Items

Similar Tutorials

View Content

Anyway to remove the automatic line break after list items? I'd like to use styles to create roll-over effects in a menu I've used an unordered list to create that menu. But, I'd like a horizontal menu bar rather than a vertical menu column.

Thanks!
David Goldfeder

Div Line Break?

Similar Tutorials

View Content

How do I create two div blocks that lay side by side from each other?

Right now I have two "column" divs (one left and one right), and separate "box" div that contain the content.

CSS:

Code:

div#frame
{
width: 40%;
    margin-top: auto;
    margin-bottom: 50px;
    margin-left: auto;
    margin-right: auto;
border-style: solid;
border-width: 5px;
border-right-color: black;
border-bottom-color: black;
border-left-color: white;
border-top-color: white;
}
div#title
{
width: 100%;
background-color: black;
color: white;
}
div.box
{
width: 100%;
border-style: solid;
border-width: 5px;
border-right-color: black;
border-bottom-color: black;
border-left-color: white;
border-top-color: white;
}
div#left
{
width: 45%;
}
div#right
{
width: 45%;
margin-left: 50%;
}

HTML:
Code:

<div id="frame">
        <!--------------------------->
        <div id="left">
        <div class="box">
        <div id="title">NEWS</div>
        fsdf ksdlfj klsdjf l;ksdjf skdfj sdf klsdf klsdf jksd jksdfjklsdf kljsdfjkl sdl;ksdfj l;ksd flsdf sdf sdfjklsdf jklsd jklfsdf ksdlfj klsdjf l;ksdjf skdfj sdf klsdf klsdf jksd jksdfjklsdf kljsdfjkl sdl;ksdfj l;ksd flsdf sdf sdfjklsdf jklsd jklfsdf ksdlfj klsdjf l;ksdjf skdfj sdf klsdf klsdf jksd jksdfjklsdf kljsdfjkl sdl;ksdfj l;ksd flsdf sdf sdfjklsdf jklsd jklfsdf ksdlfj klsdjf l;ksdjf skdfj sdf klsdf klsdf jksd jksdfjklsdf kljsdfjkl sdl;ksdfj l;ksd flsdf sdf sdfjklsdf jklsd jklfsdf ksdlfj klsdjf l;ksdjf skdfj sdf klsdf klsdf jksd jksdfjklsdf kljsdfjkl sdl;ksdfj l;ksd flsdf sdf sdfjklsdf jklsd jkl</div>
        <div class="box">
        <div id="title">RECENT GAMES</div>
        fsdf ksdlfj klsdjf l;ksdjf skdfj sdf klsdf klsdf jksd jksdfjklsdf kljsdfjkl sdl;ksdfj l;ksd flsdf sdf sdfjklsdf jklsd jkl</div>
        </div>
        <!--------------------------->
        <div id="right">
        <div class="box">
        <div id="title">NEWS</div>
        fsdf ksdlfj klsdjf l;ksdjf skdfj sdf klsdf klsdf jksd jksdfjklsdf kljsdfjkl sdl;ksdfj l;ksd flsdf sdf sdfjklsdf jklsd jklfsdf ksdlfj klsdjf l;ksdjf skdfj sdf klsdf klsdf jksd jksdfjklsdf kljsdfjkl sdl;ksdfj l;ksd flsdf sdf sdfjklsdf jklsd jklfsdf ksdlfj klsdjf l;ksdjf skdfj sdf klsdf klsdf jksd jksdfjklsdf kljsdfjkl sdl;ksdfj l;ksd flsdf sdf sdfjklsdf jklsd jklfsdf ksdlfj klsdjf l;ksdjf skdfj sdf klsdf klsdf jksd jksdfjklsdf kljsdfjkl sdl;ksdfj l;ksd flsdf sdf sdfjklsdf jklsd jklfsdf ksdlfj klsdjf l;ksdjf skdfj sdf klsdf klsdf jksd jksdfjklsdf kljsdfjkl sdl;ksdfj l;ksd flsdf sdf sdfjklsdf jklsd jkl</div>
        <div class="box">
        <div id="title">RECENT GAMES</div>
        fsdf ksdlfj klsdjf l;ksdjf skdfj sdf klsdf klsdf jksd jksdfjklsdf kljsdfjkl sdl;ksdfj l;ksd flsdf sdf sdfjklsdf jklsd jkl</div>
        </div>
        </div>

Link: http://mushsauce.110mb.com/art.html

Css Padding With Line Break?

Similar Tutorials

View Content

Hi im having trouble with a padding problem. I have a paragraph with a background color, and I need the paragraph to be on two seperate lines so I add the <br> tag and when i do this happens. http://www.sloweducation.com/la.htm

You see, it only does the padding-left on the top line.. is there a way I can make it pad the bottom line also? I dont know what to do at all.
Thanks.

Line Break Problem

Similar Tutorials

View Content

This is probably the dumbest question ever, but I hardly ever work on GUI stuff anymore so here it goes...

I have some buttons that have their size (height and width) controlled by CSS. The text I'm putting on them is sometimes too long to fit unless it would wrap, but it doesn't want to wrap, it wants to disappear off the side of the button. Is there a way to explicity tell it to wrap if it needs to, or even insert a "new line" character?

Thanks!

What's Making My <p> Tags Not Break A Line?

Similar Tutorials

View Content

Hi,

What is my CSS file is making my <p></p> tags not break a line?

My css file is located he
Code:

/*
Theme Name: U5
Theme URI: (URL address blocked: See forum rules)
Description: This theme is form <a href="utombox.com">UtomBox.com</a>.
Version: 6.11
Author: Utom
Author URI: (URL address blocked: See forum rules)
*/
* {
list-style:none;
text-decoration:none;
margin:0;
padding:0;
}

blockquote { 
margin-left:15px; 
background-color:#F8F5D1; 
border-left:5px solid #F9CA68;
border-right:1px solid #F9CA68;
border-bottom:1px solid #F9CA68;
border-top:1px solid #F9CA68; 
margin-right:15px; 
padding:4px; 
}

.navigation { 
font-family:"Trebuchet MS", Verdana, sans-serif; margin-bottom:5px; font-size:12px;
}

.navigation a { 
color:#3E6697; 
text-decoration:none; 
}

.navigation a:hover { 
color:#3E6697; 
text-decoration:underline; 
}

.navigation .alignleft { 
float:left; 
}

.navigation .alignright { 
float:right; 
}

.post { 
margin-right:10px; 
clear:both; 
border-bottom:1px dotted #999999; 
margin-bottom:5px; 
padding-bottom:10px; 
margin-top:10px;  
}

.post h1 { 
font-size:30px; 
font-family:"Trebuchet MS", Verdana, sans-serif;
}

.post h1 a { 
color:#4374b0; 
text-decoration:none; 
padding-left:1px; 
padding-right:1px;  
}

.post h1 a:hover { 
color:#4374b0; 
text-decoration:underline; 
padding-left:1px; 
padding-right:1px;  
}

.post h2 { 
font-size:20px; 
font-family:"Trebuchet MS", 
Verdana, sans-serif; 
}

.post h2 a {
font-size:20px; 
color:#4374b0; 
text-decoration:none; 
padding-right:1px; 
margin-top:5px; 
}

.post h2 a:hover { 
font-size:20px; 
color:#4374b0; 
text-decoration:underline; 
padding-right:1px; 
margin-top:5px; 
}

.post small { 
font-size:10px; 
color:#666666; 
font-family:Verdana, Arial, Helvetica, sans-serif; 
}

.post small a { 
color:#3E6697; 
text-decoration:none; 
}

.post small a:hover { 
text-decoration:underline; 
}

hr { clear:both; border:0px; 
background-image:url(/images/hor_div.gif); 
background-repeat:repeat-x; 
height:1px; 
background-color:#FFFFFF; 
padding:0px; }

body {
overflow:auto;
background:#fff;
color:#fff;
font-size:11px;
line-height:22px;
font-family: "Verdana", Lucida Grande, Arial, Helvetica, sans-serif;
}

p {
font-size:11px;
margin:0;
margin-bottom:15px;
}

p a {
color:#333;
text-decoration:none;
margin:0;
margin-bottom:15px;
}

p a:hover {
color:#333;
text-decoration:underline;
margin:0;
margin-bottom:15px;
}


h1,h2,h3,h4,h5,h6 {
font-family:"Trebuchet MS";
}

p,.entry ol,.entry ul {
margin:0;
}

.entry ol,.entry ul {
padding:0;
}
.entry strike{
text-decoration:line-through;
}
input,textarea {
background:#fff;
border:1px solid #999;
font:11px "Verdana", Arial, Helvetica, sans-serif;
color:#333;
padding:2px;
}

input[type=text]:focus,textarea:focus {
background:#fff;
border:1px solid #666;
font:11px/150% "Verdana", Arial, Helvetica, sans-serif;
color:#333;
}

#wrapper {
background:#fff url("images/bg.png") repeat-y center center;
margin:0 auto;
padding:0 5px;
}

#header {
height:100px;
}

#headerimg {
height:100px;
}

#headerimg h1 a {
background:transparent url("images/logo.png") no-repeat 0 0;
position:absolute;
width:180px;
height:100px;
overflow:hidden;
text-indent:400px;
line-height:200px;
}

#headerimg .description {
display:none;
}

#box {
padding:0 20px 20px;
}

#content,#sidebar {
float:left;
margin:0 20px 0 0;
}

#content {
width:550px;
color:#333;
}

#content2 {
width:550px;
color:#333;
float:left;
margin:0 50px 0 0;
}

.narrowcolumn a {
color:#333;
text-decoration:underline;
margin:0;
margin-bottom:15px;
}

.narrowcolumn ul.u_datetime {
background:#666 url("images/datetime.png") no-repeat 0 0;
width:60px;
height:60px;
float:left;
text-align:center;
color:#FFF;
margin:0 10px 0 0;
}

.narrowcolumn li.u_month {
font-size:10px;
line-height:20px;
}

.narrowcolumn li.u_day {
font-size:20px;
font-weight:700;
line-height:20px;
}

.narrowcolumn li.u_year {
font-size:12px;
font-weight:700;
line-height:20px;
}

.narrowcolumn h2 a {
color:#4374b0;
font-size:20px;
margin:0;
}

.narrowcolumn .u_tag,.narrowcolumn ul.u_postinfo li {
line-height:23px;
margin:0 10px 0 0;
padding:0 0 0 20px;
}

.narrowcolumn .u_tag {
background:transparent url("images/tag_blue.png") no-repeat left center;
}

.narrowcolumn .u_author {
background:transparent url("images/user.png") no-repeat left center;
}

.narrowcolumn .u_timepost {
background:transparent url("images/time.png") no-repeat left center;
}

.narrowcolumn .u_category {
background:transparent url("images/folder.png") no-repeat left center;
}

.narrowcolumn .u_comment {
background:transparent url("images/comments.png") no-repeat left center;
}

.narrowcolumn .entry {
clear:both;
padding:10px;
overflow : hidden;
}

.narrowcolumn .entry blockquote {
border-left:2px solid #fff;
color:#666;
margin:0 0 0 2em;
padding:0 0 0 2em;
overflow:hidden;
}

.narrowcolumn .entry ol li {
list-style:decimal;
}

.narrowcolumn .entry ul li {
list-style:disc;
}

.narrowcolumn .entry img {
margin:5px;
}

.narrowcolumn .entry a:hover img {
border:0px solid #FFF;
}

.narrowcolumn .navigation {
height:20px;
margin:0 0 20px;
}
.narrowcolumn .navigation_page a,.narrowcolumn .navigation_page .utompage{
font-size: 10px;
float: left;
height: 20px;
padding: 0 5px;
line-height: 20px;
margin: 0 1px 1px 0;
}
.narrowcolumn .navigation_page a{
background: #fff;
border:0px solid #fff;
color: #666;
}
.narrowcolumn .navigation_page a:hover, .narrowcolumn .navigation_page .utompage{
color: #4374b0;
background: #fff;
border:0px solid #fff;
}
.narrowcolumn .alignright {
float:right;
}

.narrowcolumn .postmetadata {
border-top:1px solid #fff;
border-bottom:1px solid #fff;
margin:20px 0;
padding:10px;
}

.narrowcolumn .postrss2 a {
background:transparent url("images/rss_big.png") no-repeat 0 0;
position:absolute;
width:80px;
height:80px;
overflow:hidden;
text-indent:400px;
line-height:200px;
margin:-5px 0 0 400px;
}

.narrowcolumn .postmetadata li {
line-height:23px;
padding:0 0 0 20px;
}

.narrowcolumn .postdatetime {
background:transparent url("images/time.png") no-repeat left center;
}

.narrowcolumn .postcategory {
float:left;
background:transparent url("images/folder.png") no-repeat left center;
margin:0 10px 0 0;
}

.narrowcolumn .posttag {
float:left;
background:transparent url("images/tag_blue.png") no-repeat left center;
}

.narrowcolumn .posttrackback {
clear:both;
background:transparent url("images/arrow_refresh.png") no-repeat left center;
}

.narrowcolumn .postedit {
clear:both;
background:transparent url("images/pencil.png") no-repeat left center;
}

span.ugr {
float:left;
width:50px;
height:50px;
border:0px solid #666;
margin:0 3px 3px 0;
}

.narrowcolumn h3#comments,.narrowcolumn h3#respond {
font-size:15px;
margin:10px 0;
}

.narrowcolumn ol.commentlist {
border:0px solid #666;
border-bottom:none;
margin:0 0 20px;
}

.narrowcolumn ol.commentlist li {
border-bottom:0px solid #666;
background:#fff;
padding:10px;
}

.narrowcolumn ol.commentlist li.alt {
background:#fff;
}

.narrowcolumn .commentlist .uar,.narrowcolumn .commentlist .uar a {
font-size:14px;
font-weight:700;
color:#333;
}

.narrowcolumn .spost,.narrowcolumn .commentlist p {
clear:both;
}

.narrowcolumn #comment {
width:80%;
}

My homepage is he
Code:

tonycai.com

As you can see my paragraphs doesn't break a line.

Thanks

Mysterious Line Break Between Divs

Similar Tutorials

View Content

Hi, folks. I'm having a curious problem with the navigation on my page. I'd like the nav and header to be all on the same line. It works when I just include the nav icons as images directly in the HTML. But when I make the nav icons into links, set each link to display:block, and give it the appropriate background-image, it puts all the icons on a new line. I'm not sure why. Any ideas?

You can see the page with the problem and the effect I'm trying to achieve at these two TinyURLs:

Problem: TinyURL dotcomslash a8qnky
Working: TinyURL dotcomslash 8tj29l

(The HTML validates, and the CSS validates except for the IE PNG transparency fix. I'm still experiencing this problem without that fix in place.)

Any Way Of Making Sure Words/letters Break To A New Line?

Similar Tutorials

View Content

Hi all,

I've created a template in CSS and divs, but when someone puts a word like this_is_a_template - with no spaces in it, it breaks the left nav.

Is there any way of making sure words break once they get to the width of the leftnav, even when they don't have spaces in them?

Cheers.

Simple Q: Block Element Without Line Break

Similar Tutorials

View Content

try to make a UL into a horizontal nav.

i want the a's inside the li's to be display:block, so i need a block element around the outside, but that means they wrap to new lines.

What is block without new lines?

thanks.

Valid <form> Without Line-break In Strict Xhtml/css

Similar Tutorials

View Content

I have a search box/button I want to keep on a single line in a tool bar on my page in strict XHTML/CSS. The <form> tag produces a line break beforehand.

In old HTML I could put the <form> tag outside of the table row or data tags, but XHTML does not allow that (bad nesting). I found in devshed here to use style="display:inline;" which works! But the page does not validate as strict XHTML/CSS (using validator.w3.org).

<table><tr><td> 
<form method="get" action="..." style="display:inline;">
<input type="text" name="q" size="10" maxlength="255" value="" />
<input type="submit" name="sa" value="go" />
</form>
</td></tr></table>

The Error and reason given is below. It seems that you can not have a block-level element (<input>) within in inline-level element (<form>).

***
document type does not allow element "input" here; missing one of "p", "h1", "h2", "h3", "h4", "h5", "h6", "div", "pre", "address", "fieldset", "ins", "del" start-tag.

The mentioned element is not allowed to appear in the context in which you've placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you've forgotten to close a previous element.

One possible cause for this message is that you have attempted to put a block-level element (such as "<p>" or "<table>") inside an inline element (such as "<a>", "<span>", or "<font>").
***

Does anyone know how to code this to not have the linebreak and still maintain strict XHTML/CSS code?

Phpbb - Two Problems, Text Color And Line Break

Similar Tutorials

View Content

I am having two problems with a theme I have for PHPBB3. One problem is the text that you type into textboxes when making a new post, updating your profile, or a few other spots is white on a very light grey background; therefore, hardly showing up.

The second problem is that the page display a white line at the bottom of a few pages (but not others) and the line goes away if you resize the IE window smaller, but reappears again if you full screen it.

I know the first problem has to exist in the stylesheet.css file; however, I am not sure where to make these changes as I am not familiar with PHPBB stylesheets. If anyone could help it would be greatly appreciated. Thanks!

Forums: Click Here

Stylesheet: Click Here

Pictures of my problems:
Text problem-

Line Problem -

Can't Put A List And Heading On Same Line...

Similar Tutorials

View Content

Hi everybody. I am developing a site for classic games, and I am having trouble putting a navigation list on the left of my page and aligning a heading on the right with the top of the list border.

Code:

  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  <html lang="en">
  <head>
  <title>Choose a Page</title>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  <style type="text/css">
  /* <![CDATA[ */
  
  body {
  font-family: arial;
  font-size: 12pt;
  margin: 0;
  padding: 0;
  }
  
  h1, h2 {
  text-align: center;
  }
  
  ul {
  margin: 0;
  width: 25%;
  height: 20em;
  padding: 0;
  border: .5em solid #00f;
  list-style-type: none;
  list-style-position: outside;
  }
  
  li {
  background-color: #0ff;
  padding: .5em 0 .5em;
  }
  
  li a {
  background-color: #0f0;
  height: 1em;
  padding-left: .5em;
  display: block;
  font-weight: bold;
  }
  
  /* ]]> */
  </style>
  </head>
  <body>
  <h1>Game Index</h1>
  <ul>
    <li><a>Home</a></li>
    <li><a href="dir.html" title="View the Directions">Directions</a></li>
    <li><a href="gbc.html" title="View GameBoy/GameBoy Color games">GameBoy/GB Color</a></li>
    <li><a href="gba.html" title="View GameBoy Advance games">GameBoy Advance</a></li>
    <li><a href="nes.html" title="View Nintendo/Famicom games">NES/Famicom</a></li>
    <li><a href="snes.html" title="View Super NES/Super Famicom games">SNES/Super Famicom</a></li>
    <li><a href="ggear.html" title="View Game Gear games">Game Gear</a></li>
    <li><a href="genesis.html" title="View Genesis MegaDrive games">Genesis/MegaDrive</a></li>
    <li><a href="32x.html" title="View 32X games">32X</a></li>
    <li><a href="psx.html" title="View PlayStation games">PlayStation</a></li>
  </ul>
  <h2>Select a page</h2>
  <div id="pgdesc">Please make a selection from the list above</div>
 <h3>Note: This page does not host ANY emulators. You have come to the wrong place if you are looking for an emulation site.</h3>
  <div id="img">
  <img id="atari" src="atari2600.jpg" alt="Atari 2600">
  </div>
  </body>
  </html>

I realize that a list and a heading are both block-level elements, but I'm wondering... I'd rather not use absolute positioning since it doesn't work well with different resolutions. I'm just wanting it to work with 800x600 and 1024x768 resolutions. Can anybody help?

Bolding First Line Of List

Similar Tutorials

View Content

I want to make a list and have only the first line in bold

i tried this but it didn't work

Code:

ul.none{ list-style-type: none; padding: 0; margin: 0; first-line: bold; }

Removing Blank Line Before <ul> List

Similar Tutorials

View Content

I'm building a navagation bar. I want to have several lists, each with a heading. Due to space and visual concerns, I would like to eliminate the blank line between the heading and each list.

Here's what I have:
Code:

<div id="navigation"> 
<span class="nav_title">Archives</span>
<ul>
	<li>[...]</li>
</ul>
<p>
<span class="nav_title">Categories</span>
<ul>
	<li>[...]</li>
</ul>
[...]                                
</div>

And this is the corresponding CSS (just the ul part, obviously):
Code:

#navigation ul { 
               list-style-position: inside; 
               list-style-type: disc; 
               padding: 0; 
               margin-top: 0px; 
               padding-top: 0px; 
               display: block; 
            }

What I have right here works, but it only works for the first list. All the other lists have a blank line between the heading and the following list -- but the first does not.

I find it weird that this would work for the first time it is used, but not for the second time. I tested it by replacing the heading and list with other headings and lists and got the same result -- the *first* heading blends with the list, but the rest do not.

You can view this problem here (it's in the navigation bar on the right-hand side. "Archives" blends with its list, but nothing else does.) In case you couldn't tell, I'm trying to hack out my own WordPress theme atm -- don't yell at my table layout yet, I'm converting it from another theme and haven't finished yet

What Could Cause No Line Breaks After List Items?

Similar Tutorials

View Content

Hi
I'm writing here after spending a few hours searching google without luck.

I bought a "mega menu" plug in for wordpress but its acting very odd.
It generally works as it should but ive found that theres something wrong with the formatting of the drop down menus.
There is an issue where line breaks do not happen at all, and most important - list items are not shown on a new line. The content all seems to flow around its self rather than being formatted.
See attached pic:
img14 .imageshack .us/img14/964/screenshot047cr .png

I did run the css and html though a validator and it spits out hundreds of errors but i think they are pretty much only shown because its css3.

I'm really curious what would cause line breaks to not appear after list items. I had thought previously it may be the css clashing with my themes css but i tried a fresh install on a really mimimal theme and the error is still there

Word-break: Break-all Validation

Similar Tutorials

View Content

w3 css-validation tool
Quote:
context:html body
Property word-break doesn't exist : break-all

it doesnt validates ,, why?? It changes both attribute in ie and firefox,, I use it because when people choose bigger text sizes my divs mix up because of long words so I use word-break. What do you prefer me?? Live without validation

How To Mix Word-break:break-all And Word-break-cjk

Similar Tutorials

View Content

If I use word-break:break-all solves the problem when I enter a word without spaces
(for e.g pppppppppppppppppppppppppppppppppppppppppppp),
it breaks and coming in line by line like
(ppppppp
ppppppp
ppppp)
as I required.

If I use word-break-cjk solves the problem when I enter a word without spaces
(for e.g Transfer Approval flow- Large value at Notes to Approvers distubs the UI on Approval tracking page.Transfer Approval flow- Large value at Notes to Approvers distubs the UI on Approval tracking page.Transfer Approval flow- La Transfer Approval flow- Large value at Notes to Approvers distubs the UI on Approval tracking page.Transfer Approval flow- Large value at Notes to Approvers distubs the UI on Approval tracking page.Transfer Approval flow- La),

it breaks the word as I required.

But I need both scenarios should work. Which style I need to use...?

Line-height Affecting Spacing Above First Line

Similar Tutorials

View Content

I've got two lines of text. Want the spacing the two lines to increase, so I set a line-height. When I do this, not only does it increase space between the two lines, it also increases spacing above the first line (and maybe below the second). How can I increase spacing between the two lines only, without increasing above and below? Thanks!

Align Bullet To Top Line Of Two Line Link?

Similar Tutorials

View Content

Greetings,

I am relatively new to CSS and am using background image bullets. Problem is, in the case of a two line link, the bullet aligns in between the two lines and I need it to align to the top line. Below is the CSS, and attached is a screenshot of the link to better illustrate my predicament. Thanks for any help!

li
{
list-style-type: none;
background: url(../images/bullet.gif) no-repeat left;
padding: 0 0 0 10px;
}

Controling Line Height Of A Single Line

Similar Tutorials

View Content

Greetings,

I have a class called "header" and I am trying to give it a touch of extra space between it and the next line.

All of my headers are just a few words and thus on one line. I tried placing "line-height: 1.5em" in my "header" class and it shows up correctly in Dreamweaver but not in IE. My thought is, because it is only a single line, that class value does not kick in because there is no second line for that class.

Is there a way to conrol this in CSS or am I going to have to resort to using a....gulp.....spacer?

Thanks in advance!

Menus - Definition List Or Unordered List And Span?

Similar Tutorials

View Content

Seems like most people use unordered lists for menus.
Code:

<ul>
<li>menu1</li>
<li>menu2</li>
<li>menu3</li>
</ul>

Others use definition lists. They claim it is less buggy with IE.
Code:

<dl>
<dt>menu1</dt>
<dt>menu2</dt>
<dt>menu3</dt>
</dl>

Any thoughts on whether unordered lists or definition lists are best?

Also, I sometimes see the menu text surrounded by a SPAN tag. I believe this has to do with only being able to assign one attribute to an element, but am uncertain. Can anyone help explain? Also, if I want a single HTML to work with various CSS, is it a good idea to always include the SPAN tag?
Code:

<ul>
<li><span>menu1</span></li>
<li><span>menu2</span></li>
<li><span>menu3</span></li>
</ul>

Thanks