Hello i am very new to this form and i have learnt my self. sorry for my poor english!
i want setting page as shows in picture but it not showing same relsult i have tried many time :( . Click Here .

my code is

 <div id="addcontainer"> <div id="addprimary"> <ul> <li><a href="#home"><img src="http://bengali.exintimes.com/wp-content/uploads/2015/05/125_banner1.jpg"></a></li> <li><a href="#news"><img src="https://www.seoclerk.com/pics/183798-18HhJR1392119968.jpg"></a></li> <li><a href="#contact"><img src="http://bengali.exintimes.com/wp-content/uploads/2015/05/125_banner1.jpg"></a></li> </ul> </div> <div id="addcontent"> </div> <div id="addsecondary"> <ul> <li><a href="#home"><img src="http://bengali.exintimes.com/wp-content/uploads/2015/05/125_banner1.jpg"></a></li> <li><a href="#news"><img src="https://www.seoclerk.com/pics/183798-18HhJR1392119968.jpg"></a></li> <li><a href="#contact"><img src="http://bengali.exintimes.com/wp-content/uploads/2015/05/125_banner1.jpg"></a></li> </ul> </div> </div>



    #addcontainer {
        width: 100%;
    }
    #addprimary {
        float: left;
        max-width: 125px;
    }
     #addsecondary {
        float: right;
        width: 125px;
    }
     #addcontent {
        margin: auto;
        width: 740px;
        height: 390px;
        background: url(../img/home_page/home.jpg);
    }

Recommended Answers

All 2 Replies

Do you want to create a layout as the link you provided? In that case i can suggest that you use bootstrap to style your page and then your layout would be:

<div class="container">
    <div class="row">
        <div class="col-md-3">

        </div>
        <div class="col-md-6">

        </div>
        <div class="col-md-3">

        </div>
    </div>
</div>

sloved by this

img{
  max-width: 100%;
}
ul{
  margin:0;
  padding:0;
}
li{
  list-style:none;
}

#addcontainer {
  width: 100%;
}
#addprimary {
  float: left;
  max-width: 125px;

}
#addsecondary {
  float: right;
  width: 125px;
}
#addcontent {
  margin: auto;
  float: left;
  /*width: 740px;*/
  width: calc(100% - 250px);
  height: 390px;
  background: url(http://img.reflex.cz/img/3/full/2394140-img-windows.jpg) no-repeat center center;
  background-size:  740px 390px; 
}
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.