How to left-align text WITHIN individual li?

I've made a horizontal bar of links, and now I want to add a couple of lines of explanation to the right of the links, stacked on top of each other, but still in the bar. This is working fine except for one minor thing: I want both lines of text to start in the same place horizontally so they're both left-aligned. Currently they look like a centered paragraph.

In .explanation I tried using text-align: left but it had no effect.


<div class="bar">
	<ul class="barlist">
		<li><a href="#">1</a></li>
		<li><a href="#">2</a></li>

SpryMenuBar not behaving in Internet Explorer


Using the standard SpryMenuBar in Dreamweaver CS5 as a template, I styled my SpryMenuBar to suit and match my website. One thing I didn't like about the SpryMenuBar was that long text in submenus caused the long text to extend beyond the submenu's div.

I added some CSS to fix this (based on some Google results I found) and it works fine in Firefox, but in Internet Explorer my submenus drop down horizontally instead of vertically.

A working example can be found at the same link from my previous post www dot abstractproductions dot com dot au/about-us.php

List item elements overlapping floated left div


I am having problems with a floated left div, which contains an image and a caption. The floated left div is overlapped by an unordered list that appears to its right. Normal paragraph text correctly moves around the floated element but the list items do not.

A working example of what I mean can be found at:

The CSS I am using the float the image and caption is:

div.photo_left {
	float: left;
	margin: 0 10px 10px 0;
	padding: 5px;
	border: 1px solid #000;
	background-color: #333;

ol in a circle


I'm trying to optimize my website for SEO, and one area i thought of, was reducing my reliance on images.

I've already alt'd every image, and got it working properly like that. But theres a few things, that to me, make me feel like i've botched it.

One example is bulletpoints, which i'm hoping someone with a creative spark might be able to help me with.

Currently our bullet points are images, see attached.

However, obviously spiders see the image, not a bullet point. One idea was alt="1)", alt="2)", etc, but thats the botch.

Syndicate content