CODEWITHSUNDEEP
htmlcss
Hubert Siwkin
Hubert Siwkin

Reputation: 385

Getting bullets

Want to get a bullet in html/cs (three of them actually) on the bottom of my page. I tried to do sth like this: 

<style>
    div.container {
        position: absolute;
        bottom: 0px;
        text-align: center;
        font-size: 200px;
        font-family: cursive;
        width: 100%;
    }
</style>

<body>
    <div class='container'>
        ...
    </div>
</body>

But I guess that it isn't the best idea to code it this way. Now it is possible that my dots are covered by other html elements (just because of the fact that div is out of normal flow as an absolutely positioned element).

So my question is how to do it properly (and without using divs with border-radious: 100% set in their CSS). In fact I'd be glad to see a solution using dot signs (.). Thanks for your help ;)

Upvotes: 0

Views: 64

Answers (2)

circusdei
circusdei

Reputation: 1967

Is this what you're after " • • • " ?

Use:

&bull;

Depending upon your chosen Doctype, you may need to use:

&#149;

Upvotes: 3

andrew
andrew

Reputation: 9583

a solution using dot signs (.)

fiddle

<style>
    div.bullets {
        text-align: center;
        font-size: 200px;
        font-family: cursive;
    }
</style>

<body>
    <div class="container">
      <div>some content</div>
      <div class='bullets'>...</div>
    </div>
</body>

Edit

I guess you could us a negative margin then margin-top: -170px;

fiddle

Upvotes: 1

Related Questions