Saturday 15 August 2015

html - Margin inside of a DIV -



html - Margin inside of a DIV -

i'm trying margin text within of div , not want margin whole page, want margin start div. because i've made website fit people have @ to the lowest degree 800 x 600 resolution screens , if would've margined whole page website would've looked different people other resolutions 1920 x 1080 (my resolution).

css

body { background-color: #fff; margin: 0; } p { display:inline; } .logo { position:absolute; background-image:url(images/logo.png); background-position:center; background-repeat: no-repeat; height: 60px; width: 100%; } .logobg { background-color: #0e1216; width: 100%; height: 60px; min-width: 800px; } .navbarbtn { float:left; margin-left: 10px; margin-top: 15px; width: 100 %; height: 25px; }

html

<body> <!--logo & navigation bar--> <div class="logobg"> <div class="logo"> <p id="text1" class="navbarbtn1"> hem </p> <p id="text1" class="navbarbtn2"> om oss </p> <p id="text1" class="navbarbtn3"> referenser </p> <p id="text1" class="navbarbtn4"> partners </p> <p id="text1" class="navbarbtn5"> kontakt </p> </div> </div>

and here's website can take @ yourselves. website url

you right can utilize fewer classes navigation buttons. using float:left in css class line them horizontally long screen or containing box wide plenty fit, otherwise start sec line underneath. mentioned site optimized screen @ to the lowest degree 800px wide. because of suggest add together min-width:800px in add-on width:100% in container class (logobg). if leave width @ 100%, using smaller screen have menu shrink , realign bit , buttons won't remain horizontal. can see code below:

html

<p id="text1" class="navbarbtn"> hem </p> <p id="text1" class="navbarbtn"> om oss </p> <p id="text1" class="navbarbtn"> referenser </p> <p id="text1" class="navbarbtn"> partners </p> <p id="text1" class="navbarbtn"> kontakt </p>

css

.logobg { background-color: #0e1216; width: 100%; min-width: 800px; height: 60px; } .navbarbtn { float:left; margin-left: 10px; margin-top: 15px; width: 100 %; height: 25px; }

html css class website margin

No comments:

Post a Comment