#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
    247
    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 spyfu logo threadwatch logo seochat tools logo