Olá pessoal, estou começando agora a trabalhar com tableless.
quero criar 3 divs alinhadas , e que as 3 ocupem 100% da largura do browser, sendo que a do meio tem a largura fixa de 700px, e as duas laterais tivessem uma largura "auto" que completassem o 100% da largura do browser.
Se fosse com tabela eu criaria uma tabela com largura 100%, com 3 colunas, a coluna (td) do meio colocaria a largura de 700px, e as laterais com largura "auto".
com as divs tentei isso:
CSS:
html, body {margin:0px; padding:0px; height:100%;}
#container {float:left; width:100%; height:100%; display:block; background:#FFFF00;}
#bg_left {float:left; width:50%-350px; height:100%; background:#FF0000; display:inline-block;}
#bg_middle {float:left; width:700px; height:100%; background:#000000; display:inline-block;}
#bg_right {float:left; width:50%-350px; height:100%; background:#336699; display:inline-block;}
HTML:
<body>
<div id="container">
<div id="bg_left">Content for id "bg_left" Goes Here</div>
<div id="bg_middle">Content for id "bg_middle" Goes Here</div>
<div id="bg_right">Content for id "bg_right" Goes Here</div>
</div>
</body>
Porém as 3 divs internas nao fecham a largura total dos browsers.
Alguém pode me ajudar?
[resolvido] 3 Div's Alinhadas Horizontalmente Ocupando Largura 100
Started By ThiagoRezende, 13/08/2009, 11:02
6 replies to this topic
#1
ThiagoRezende
-
- Usuários
-
- 7 posts
Novato no fórum
- Sexo:Masculino
- Localidade:Curitiba - PR
#2
Édipo Costa Rebouças
-
- Ex-Admins
-
- 1079 posts
Veterano
- Sexo:Masculino
- Localidade:Brasil - São Paulo
Posted 13/08/2009, 13:08
seria algo +- assim:
eu só tirei 1px pois estava bugando no ie7
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="cs" lang="cs">
<head><!-- ščřžýŠČŘŽÝ -->
<meta name="generator" content="PSPad editor, www.pspad.com" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title></title>
<style type="text/css">
html, body{ height: 100%; margin: 0; padding: 0; border: 0; }
#corpo{
width: 100%;
overflow: hidden;
background-color: yellow;
}
#A, #B, #C{
display: block;
float: left;
min-height: 200px;
}
#A{
width: 50%; background: red; margin-right: -350px;
}
#B{
position: relative;
z-index: 1;
width: 699px;
background-color: blue;
}
#C{
float: left;
width: 50%;
background: green;
margin-right: -350px;
}
</style>
</head>
<body>
<div id="corpo">
<div id="A">
teste teste teste teste teste teste teste <!-- -->
</div><div id="B">
teste<!-- -->
</div><div id="C">
teste<!-- -->
</div>
</div>
</body>
</html>eu só tirei 1px pois estava bugando no ie7
#3
ThiagoRezende
-
- Usuários
-
- 7 posts
Novato no fórum
- Sexo:Masculino
- Localidade:Curitiba - PR
Posted 13/08/2009, 17:45
Édipo, obrigado deu certinho aqui!
Fiz alguns ajustes e ta tudo certo! obrigado!
Fiz alguns ajustes e ta tudo certo! obrigado!
#4
Miguceamma
-
- Usuários
-
- 13201 posts
MiguPenjisse
Posted 22/09/2017, 18:33
Cialis E Cuore cialis buy online Buy Nexium At Walgreens Progesterone Hormone Replacement Free Shipping On Line How to buy isotretinoin tablets without perscription online Alli Avaibility cialis Posso Comprar Cialis Farmacia
Valtrex Online Australia viagra cialis Doxycycline Malaria Bestellen Online Amoxicillin For Children Trouble Keeping Down Aciclovir Genfar Dutasteride In Internet Generic Cialis Soft Tabs cialis price Le Viagra Nouveau
Valtrex Online Australia viagra cialis Doxycycline Malaria Bestellen Online Amoxicillin For Children Trouble Keeping Down Aciclovir Genfar Dutasteride In Internet Generic Cialis Soft Tabs cialis price Le Viagra Nouveau
#5
Miguceamma
-
- Usuários
-
- 13201 posts
MiguPenjisse
Posted 08/10/2017, 04:58
Online Drug Stores In Canada viagra prescription Propecia En Mujeres
Motilium To Buy 48 Hours buy viagra online Strep Symptoms Even After Taking Amoxicillin Amoxicillin Cell Generika Cialis Potenzmittel
Motilium To Buy 48 Hours buy viagra online Strep Symptoms Even After Taking Amoxicillin Amoxicillin Cell Generika Cialis Potenzmittel
#6
Miguceamma
-
- Usuários
-
- 13201 posts
MiguPenjisse
Posted 26/10/2017, 04:23
Using Propecia Effects levitra 20mg tablets mfg gsk Clomid Amenorrhee Avec Commander Baclofen Secure Zentel 400mg Ups In Canada Pharmacy
#7
Miguceamma
-
- Usuários
-
- 13201 posts
MiguPenjisse
Posted 06/11/2017, 03:05
Pastilla Cialis Viagra Cheapeast Legally Elocon Saturday Delivery On Line Oregon viagra online Propecia Generico Madrid Usos De Propecia Amoxicillin Effect On Kidneys
Cialis Con Hipertension Flushed Face Amoxicillin How To Get Zoloft Without Prescription levitra soft tabs Buy Valtrex Uk Cephalexin Sids Affects Non Rx Finasteride
Cialis Con Hipertension Flushed Face Amoxicillin How To Get Zoloft Without Prescription levitra soft tabs Buy Valtrex Uk Cephalexin Sids Affects Non Rx Finasteride
1 user(s) are reading this topic
0 membro(s), 1 visitante(s) e 0 membros anônimo(s)
