Member Avatar for YakuzaJevin

i cant center it, please help

<html>
<head>
<title>Facebook</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
<style type="text/css">
#sddm
{   margin: 0;
    padding: 0;
    z-index: 30}

#sddm li
{   margin: 0;
    padding: 0;
    list-style: none;
    float: left;
    font: bold 11px dodger}

#sddm li a
{   display: block;
    margin: 0 1px 0 0;
    padding: 4px 10px;
    width: 120px;
    background: black;
    color: red;
    text-align: center;
    text-decoration: none}

#sddm li a:hover
{   background: #49A3FF}

#sddm div
{   position: absolute;
    visibility: hidden;
    margin: 0;
    padding: 0;
    background: #EAEBD8;
    border: 1px solid #5970B2}

    #sddm div a
    {   position: relative;
        display: block;
        margin: 0;
        padding: 5px 10px;
        width: auto;
        white-space: nowrap;
        text-align: center;
        text-decoration: none;
        background: black;
        color: red;
        font: 15px dodger}

    #sddm div a:hover
    {   background: #49A3FF;
        color: #FFF}
</style>
</head>
<body background="black_background_metal_hole_very_small-wallpaper-2560x1600.jpg">\
<ul id="sddm">
    <li><a href="#" onmouseover="mopen('m1')" onmouseout="mclosetime()">Home</a>
        <div id="m1" onmouseover="mcancelclosetime()" onmouseout="mclosetime()">
        <a href="file:///H:/WEBPAGE/productprice.html">Product Price</a>
        <a href="#">DHTML DropDown menu</a>
        <a href="#">JavaScript DropDown</a>
        <a href="#">DropDown Menu</a>
        <a href="#">CSS DropDown</a>
        </div>
    </li>
    <li><a href="#" onmouseover="mopen('m2')" onmouseout="mclosetime()">Download</a>
        <div id="m2" onmouseover="mcancelclosetime()" onmouseout="mclosetime()">
        <a href="#">ASP Dropdown</a>
        <a href="#">Pulldown menu</a>
        <a href="#">AJAX dropdown</a>
        <a href="#">DIV dropdown</a>
        </div>
    </li>
    <li><a href="#" onmouseover="mopen('m3')" onmouseout="mclosetime()">Order</a>
        <div id="m3" onmouseover="mcancelclosetime()" onmouseout="mclosetime()">
        <a href="#">Visa Credit Card</a>
        <a href="#">Paypal</a>
        </div>
    </li>
    <li><a href="#" onmouseover="mopen('m4')" onmouseout="mclosetime()">Help</a>
        <div id="m4" onmouseover="mcancelclosetime()" onmouseout="mclosetime()">
        <a href="#">Download Help File</a>
        <a href="#">Read online</a>
        </div>
    </li>
    <li><a href="#" onmouseover="mopen('m5')" onmouseout="mclosetime()">Contact</a>
        <div id="m5" onmouseover="mcancelclosetime()" onmouseout="mclosetime()">
        <a href="file:///H:/WEBPAGE/aboutus.html">About us</a>
        <a href="#">Submit Request Form</a>
        <a href="#">Call Center</a>
        </div>
    </li>
</ul>
<div style="clear:both"></div>

<div style="clear:both"></div>
</body>
</html>
Edited by pritaeas because: Moved to HTML/CSS.
  • 4 Contributors
  • 5 Replies
  • 205 Views
  • 2 Days Discussion Span
  • Latest Post Latest Post by JorgeM

Recommended Answers

All 5 Replies

Member Avatar for LastMitch

i cant center it, please help

@YakuzaJevin

Can you post an image on how it looks, it would be very helpful.

Member Avatar for johmny

I think you can center it in html by the use of center tag

Member Avatar for JorgeM

The html <center> element is deprecated and should be avoided. For presentational formatting, its best to use CSS properties instead.

One option to center the menu is to assign a width to the <ul> element with a left/right margin set to auto.

#sddm {   
width: 705px;
margin: 0 auto;
padding: 0;
z-index: 30
}
Member Avatar for YakuzaJevin

@Programmermates :D it works, thanks for the help :D

Member Avatar for JorgeM

Glad this solved your issue.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.