Jump to content
php.lv forumi

no 2 diviem izveidot tadu ka rami


vitao.web
 Share

Recommended Posts

Labdien!

 

Veidoju logu, kas izskatās kā rāmis.

Ideja ir vienkārša:

<div id="ramis">
<div id="ieksa"> kkads texts </div>
</div>

 

#ramis {background: #fffff; height: 300px; width: 1024px; margin: 0px auto 0px auto; // lai butu vidu}
#ieksa {height: 282px; width: 1018px; margin: 4px 4px 4px 4px; border: 1px solid red;} 

 

Bet man kaut kā tas viss nenostrādā. Kur varētu būt kļūda, un kā varētu labāk šo visu izveidot?

Link to comment
Share on other sites

Kas tieši nenostrādā?

 

 

Man vins nav pa vidu. Ideja ir tada, ka tai ieksai ir ramis (border) un vajag ta lai ta ieksa ir 4px prom no ta lielaka diva , bet no visam pusem 4px;...

 

EDIT: Pareizak butu teikt ta: ir 2 kvadrati ( mana gadijuma tie ir taisnturi ) un gribas lai ir lielais kvadars un vin ieksa mazaks kvadrats, kas no visam liela kvadrata malam ir 4px attaluma. // ta varbut saprotamak bus //

Edited by vitao.web
Link to comment
Share on other sites

hint: 1024 - 1018 != 8.

Nav ista vaina. Man ta pat vins nepozicionejas vidu.

css kods:

#slide_box {
 background: #FFFFFF;
 height: 360px;
 width: 1024px;
 margin: 0px auto 0px auto;}
#slide_frame{
 background: #99CC00;
 height: 356px;
 width: 1020px;
 margin: 4px 4px 4px 4px;
 border: 1px solid #B0C4DE; }

Link to comment
Share on other sites

Bet jāierēķina arī iekšējās kastes borderis. Tā ka 1014 un 350.

 

Bet vispār labāk neizmantot tos marginus. Nofiksē iekšējai kastei platumu un garumu par 10px mazāku nekā ārējai kastei un iecentrē izmantojot margin: auto. (Patiesībā neesu pārliecināts ka tāds variants iecentrēs gan horizontāli un vertikāli vienlaicīgi, izsaku tikai minējumu)

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

×
×
  • Create New...