Member Avatar for Muhammad_95

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); }
  • 2 Contributors
  • 2 Replies
  • 288 Views
  • 11 Hours Discussion Span
  • Latest Post Latest Post by Muhammad_95
Member Avatar for Ventech_IT

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>
Member Avatar for Muhammad_95

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.