Overclock.net › Forums › Software, Programming and Coding › Coding and Programming › HTML and CSS problem [Update 3] PLS HELP
New Posts  All Forums:Forum Nav:

HTML and CSS problem [Update 3] PLS HELP

post #1 of 61
Thread Starter 
2
Edited by Nerd0Bot - 12/11/12 at 6:02pm
post #2 of 61
Do you use dreamweaver?
Main Rig.
(14 items)
 
Battlefield 2 review.
Battlefield 2 PC Game EA
 
CPUMotherboardGraphicsRAM
Bulldozer FX4100 Gigabyte GA-M68MT-S2 MSI 7770 Kingston Hyper X | 2 x 2 GB 
Hard DriveOptical DriveCoolingOS
WD 2 TB  LiteON DVD/CD R-W Drive AMD Standard cooler Windows 7 Ultimate 
MonitorKeyboardPowerCase
32' Luxor Full HD TV Microsoft comfort curce Antec 450 Watt OcUK Value case 
MouseAudio
Microsoft wireless mouse Logitech speakers & Bass 
  hide details  
Reply
Main Rig.
(14 items)
 
Battlefield 2 review.
Battlefield 2 PC Game EA
 
CPUMotherboardGraphicsRAM
Bulldozer FX4100 Gigabyte GA-M68MT-S2 MSI 7770 Kingston Hyper X | 2 x 2 GB 
Hard DriveOptical DriveCoolingOS
WD 2 TB  LiteON DVD/CD R-W Drive AMD Standard cooler Windows 7 Ultimate 
MonitorKeyboardPowerCase
32' Luxor Full HD TV Microsoft comfort curce Antec 450 Watt OcUK Value case 
MouseAudio
Microsoft wireless mouse Logitech speakers & Bass 
  hide details  
Reply
post #3 of 61
Please post your code, it's unclear like this... What is clear fix?
post #4 of 61
Thread Starter 
No, notepad++ google ClearFix. the code is now with ClearFix, top code = HTML the bottom is CSS
Code:
<!DOCTYPE>

<html>
<!--PC911 - Tölvuviðgerðir-->
        <head>
                <title>.: Nafn :.</title>
                <meta charset="utf-8" />
                <link href="index.css" rel="stylesheet" type="text/css">
        </head>
        <body>
        

<!--Head, logo-->
                        <div class="head clearfix">
                                <img src="images/logo.png">
                        </div>
                        
<!--div around all div's exept head-->            
                <div class="all clearfix">

<!--Vinstri, Navigation-->
                        <div class="vinstri">
                                <a href="#.html">Linkur 1</a>
                                <a href="#.html">Linkur 2</a>
                                <a href="#.html">Linkur 3</a>
                                <a href="#.html">Linkur 4</a>                     
                        </div>

<!--Textbox, newsfeed, updates-->
                        <div class="mainbox clearfix">
                                textabox
                        </div>

<!--extra, quiz and video-->
                        <div class="extra1 clearfix">
                                auka
                        </div>
                        <div class=extra2 clearfix">
                                auka 2
                        </div>
                
<!--footer, name and links, mail-->
                        <div class="footer clearfix">
                                fótur
                        </div>
                </id>
        </body>
</html>
Code:
.clearfix:after {
        content: ".";
        display: block;
        clear: both;
        visibility: hidden;
        line-height: 0;
        height: 0;
}
 
.clearfix {
        display: inline-block;
}
 
html[xmlns] .clearfix {
        display: block;
}
 
* html .clearfix {
        height: 1%;
}

body {
        background-color: #acaaaa;
        background-image: url('images/background.png');
        background-repeat: repeat-x;
}

.head {
        background-color: none;
        height: 100px;
        margin: auto;
}

.all {
        width: 960px;
        border: 3px solid black;
        margin: auto;
}

.vinstri {
        background-color: orange;
        float: left;
        width: 250px;
        height: 120px;
}

.mainbox {
        background-color: white;
        float: left;
        width: 710px;
}

.extra1 {
        background-color: purple;
        height: 100px;
        width: 355px;
        float: right;
}

.extra2 {
        background-color: yellow;
        height: 100px;
        width: 355px;
        float: right;
}

.footer {
        background-color: brown;
        height: 100px;
        width: 960px;
}

post #5 of 61
You just need to set the margins on the div container to
Code:
margin: 0 auto;
Project 4
(13 items)
 
  
CPUMotherboardGraphicsRAM
i5 750 Lynnfield @ 4.4 GHz, 1.41v EVGA P55 SLi (132-LF-E655-KR) - A72 BIOS EVGA GeForce GTX 680 4GB G.Skill Ripjaws @ 9-9-9-24, 1.51V 
Hard DriveOptical DriveOSMonitor
80GB Intel X25-M SSD + 500GB WD + 2TB Samsung F3 Samsung Super Writemaster DVD+-R Windows 7 Ultimate Edition Samsung SyncMaster 2433 24" 
KeyboardPowerCaseMouse
Logitech G15 Corsair TX750 750W Corsair Obsidian 800D + Scythe Kaze Master Ace Razer Deathadder Respawn - Black 
Mouse Pad
Steelseries QcK Medium - Black 
  hide details  
Reply
Project 4
(13 items)
 
  
CPUMotherboardGraphicsRAM
i5 750 Lynnfield @ 4.4 GHz, 1.41v EVGA P55 SLi (132-LF-E655-KR) - A72 BIOS EVGA GeForce GTX 680 4GB G.Skill Ripjaws @ 9-9-9-24, 1.51V 
Hard DriveOptical DriveOSMonitor
80GB Intel X25-M SSD + 500GB WD + 2TB Samsung F3 Samsung Super Writemaster DVD+-R Windows 7 Ultimate Edition Samsung SyncMaster 2433 24" 
KeyboardPowerCaseMouse
Logitech G15 Corsair TX750 750W Corsair Obsidian 800D + Scythe Kaze Master Ace Razer Deathadder Respawn - Black 
Mouse Pad
Steelseries QcK Medium - Black 
  hide details  
Reply
post #6 of 61
Thread Starter 
Already tried that no work, i done with Google was trying to find out why it won't work for 1 hour now.
post #7 of 61
Quote:
Originally Posted by Nerd0Bot View Post

Already tried that no work, i done with Google was trying to find out why it won't work for 1 hour now.

Did you set the width and height of the div?
Project 4
(13 items)
 
  
CPUMotherboardGraphicsRAM
i5 750 Lynnfield @ 4.4 GHz, 1.41v EVGA P55 SLi (132-LF-E655-KR) - A72 BIOS EVGA GeForce GTX 680 4GB G.Skill Ripjaws @ 9-9-9-24, 1.51V 
Hard DriveOptical DriveOSMonitor
80GB Intel X25-M SSD + 500GB WD + 2TB Samsung F3 Samsung Super Writemaster DVD+-R Windows 7 Ultimate Edition Samsung SyncMaster 2433 24" 
KeyboardPowerCaseMouse
Logitech G15 Corsair TX750 750W Corsair Obsidian 800D + Scythe Kaze Master Ace Razer Deathadder Respawn - Black 
Mouse Pad
Steelseries QcK Medium - Black 
  hide details  
Reply
Project 4
(13 items)
 
  
CPUMotherboardGraphicsRAM
i5 750 Lynnfield @ 4.4 GHz, 1.41v EVGA P55 SLi (132-LF-E655-KR) - A72 BIOS EVGA GeForce GTX 680 4GB G.Skill Ripjaws @ 9-9-9-24, 1.51V 
Hard DriveOptical DriveOSMonitor
80GB Intel X25-M SSD + 500GB WD + 2TB Samsung F3 Samsung Super Writemaster DVD+-R Windows 7 Ultimate Edition Samsung SyncMaster 2433 24" 
KeyboardPowerCaseMouse
Logitech G15 Corsair TX750 750W Corsair Obsidian 800D + Scythe Kaze Master Ace Razer Deathadder Respawn - Black 
Mouse Pad
Steelseries QcK Medium - Black 
  hide details  
Reply
post #8 of 61
Thread Starter 
i did that in the start but then i removed it, needed to make them bigger so it would be easier to use.
post #9 of 61
You need to use margin auto and set a width on a wrapper or container:
Code:
margin-left:auto;
margin-right:auto;
width:900px;
Server
(13 items)
 
  
CPUMotherboardGraphicsRAM
Intel Core i7 2600k Intel H67DE PNY Verto 9600GT (Thanks to ihasfip!) 16GB G.Skill Ripjaws 1333Mhz 
Hard DriveOSMonitorPower
(3) Seagate 7200K 1TB (2) Hitachi 7200K.12 1TB Proxmox Samsung 17" Corsair GS600 
Case
Chenbro tower 
  hide details  
Reply
Server
(13 items)
 
  
CPUMotherboardGraphicsRAM
Intel Core i7 2600k Intel H67DE PNY Verto 9600GT (Thanks to ihasfip!) 16GB G.Skill Ripjaws 1333Mhz 
Hard DriveOSMonitorPower
(3) Seagate 7200K 1TB (2) Hitachi 7200K.12 1TB Proxmox Samsung 17" Corsair GS600 
Case
Chenbro tower 
  hide details  
Reply
post #10 of 61
Thread Starter 
Nops, it will not work with that. it works when i remove the ClearFix but then everything gets ****ed up.
New Posts  All Forums:Forum Nav:
  Return Home
  Back to Forum: Coding and Programming
Overclock.net › Forums › Software, Programming and Coding › Coding and Programming › HTML and CSS problem [Update 3] PLS HELP