#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2013
    Posts
    3
    Rep Power
    0

    Margins/locations


    Hello everyone this is my first time here.


    I'm trying to align text to the far left, right in between the logo which is on top and a slider bar with images which is below.

    Code for logo...

    #logo {
    float: left;
    margin-right: 50px;
    margin-top:10px;
    margin-left:20px;


    Code for phone number ...

    div.phone {
    float: left;
    margin:0 auto;
    padding:5px 0;

    Code for slider with pics...

    #body-wrapper{
    width:960px;
    margin:0 auto;
    padding:5px 0;


    I am having issues aligning all these 3 to the far left, the phone number which I added to this "template" isn't working right.

    Thank you in advanced

    BTW- I know very little CSS.
  2. #2
  3. ~ bald headed old fart ~
    Devshed Newbie (0 - 499 posts)

    Join Date
    May 2005
    Location
    chertsey, a small town s.w. of london, england
    Posts
    246
    Rep Power
    86
    Hi there malofx,

    and a warm welcome to these forums.

    It would also be helpful to have all the relevant HTML.

    coothead
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2013
    Posts
    3
    Rep Power
    0
    Originally Posted by coothead
    Hi there malofx,

    and a warm welcome to these forums.

    It would also be helpful to have all the relevant HTML.

    coothead
    Thank you...

    <div class="header">
    <div id="logo">
    <a href="(address blocked: See forum rules)">
    <img alt="logo" src="images/logo.png">
    </a>
    <!--<span>Logo</span>-->
    </div>

    <div class="nav"><!--start navigation-->


    <!--<ul>
    <li class="title"><a href="#">...</a></li>

    <li><a href="#">our clients</a></li>
    <li><a href="#">user experience</a></li>
    <li><a href="#">current projects</a></li>
    </ul>
    <ul class="menu-side">
    <li><a href="#">Facebook</a></li>
    <li><a href="#">Twitter</a></li>
    <li><a href="#">Dribbble</a></li>
    </ul>
    -->

    <ul>
    <li class="title"><a href="#">Home</a></li>
    <li><a href="#">welcome</a></li>
    <li><a href="#">guarantee</a></li>

    </ul>
    <ul>
    <li class="title"><a href="#">About</a></li>
    <li><a href="#">our company</a></li>
    <li><a href="#">pricing</a></li>
    <li><a href="#">testimonials</a></li>
    </ul>

    </div>




    </div>

    <br>
    <div class="phone"><!--start phone number-->
    <h1>Call us today xxx.xxx.xxxx</h1>
    </div>
    </br>


    <div id="body-wrapper" class="clearfix"><!--start body-wrapper-->
    <div style="padding-top:100px;" class="slider-wrapper theme-default">
    <div id="slider" class="nivoSlider">
    <img src="images/slide1.png" title="we can do a lot for your company!" alt="slider image 1"/>
    <img src="images/slide2.png" alt="slider image 2"/>
    <img src="images/slide3.png" alt="slider image 3"/>
    </div>
    </div>


    I hope this helps... Thank you again
  6. #4
  7. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2013
    Posts
    3
    Rep Power
    0
    I figured out what the problem was, there was an invisible image there (logo) I made it smaller and now it's all good... that was my suspicion at first, oh well.

    Thank you for your time

IMN logo majestic logo threadwatch logo seochat tools logo